/* home page menu css*/
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Readable text wrapping, site-wide ──
   Headings wrap into balanced (even-length) lines instead of a long line + a stub word.
   Body copy avoids orphans (a lone word on the last line). No manual <br> needed anywhere. */
h1, h2, h3, h4, h5, h6,
.wp-block-heading { text-wrap: balance; }
p, li { text-wrap: pretty; }

:root {
  --purple:      #50269E;
  --purple-lt:   #6b3fc4;
  --purple-bg:   #f0ebff;
  --purple-icon: #EDE7FF;
  --navy:        #0d1224;
  --white:       #ffffff;
  --text-dark:   #0d1224;
  --text-mid:    #4a5568;
  --text-light:  #696b6e;
  --border:      #e8eaf0;
  --radius-lg:   20px;
  --radius-md:   12px;
  --radius-sm:   8px;
  --shadow:      0 24px 80px rgba(13,18,36,.18);
  --font:        "AlmadenSans para", Inter;
}

/*
  ── CENTERING STRATEGY: pure flexbox, no translateX tricks ──
  1. .ix-mega-menu-wrapper  → position:relative, width:100% (full navbar width)
  2. .ix-dropdown-row       → position:absolute, left:0, right:0 → stretches full width
                              display:flex, justify-content:center → centers the child
  3. .ix-dropdown           → just a max-width block, no positioning needed at all
  Works perfectly at every breakpoint with zero hacks.
*/
.ix-mega-menu-wrapper {
  position: relative;
  width: 100%;
}

/* Trigger buttons row — sits inline with the rest of the navbar */
.ix-mega-menu {
  display: inline-flex;
  align-items: center;
}

.ix-main-menu {
  list-style: none;
  display: flex;
  gap: 4px;
}
.ix-main-item > a {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #ffffff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  padding: 0px 14px;
  border-radius: 8px;
  transition: .2s ease;
  cursor: pointer;
  user-select: none;
  font-family: 'AlmadenSans para';
}
.ix-main-item > a:hover { color: #fff;background:none;  }
.ix-main-item.active > a { color: #fff; background: rgb(80, 38, 158);padding: 8px 14px; }

li.ix-main-item {
    display: flex;
}

.ix-chevron {
  transition: transform .25s ease;
  opacity: .7;
  flex-shrink: 0;
}
.ix-main-item.active > a .ix-chevron { transform: rotate(180deg); opacity: 1; }

/* ── Flex row: full-width absolute container that centers the dropdown ── */
.ix-dropdown-row {
  position: absolute;
  top: calc(100% + 30px);
  left: -160px;
  right: 0;
  display: none;
  justify-content: center;
  padding: 0;
  z-index: 9999;
  width: 1360px;
}

.ix-dropdown-row.open {
  display: flex;
}

/* ── Dropdown card — just a max-width block, flexbox does the centering ── */
.ix-dropdown {
  width: 100%;
  max-width: 1360px;
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  overflow: hidden;
}

/* ── Panels ── */
.ix-panel { display: none; }
.ix-panel.active { display: block; }

/* ── Tab strip ── */
.ix-tab-strip {
  display: flex;
  align-items: stretch;
  background: #fafbff;
  border-bottom: 1px solid var(--border);
  padding: 0 28px;
  gap: 0;
}
.ix-tab {
  padding: 18px 20px 16px;
  cursor: default;
}
.ix-tab strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 3px;
  font-family: 'AlmadenSans para';
}
.ix-tab span {
  font-size: 12px;
  color: var(--text-light);
  font-family: 'AlmadenSans para';
}
.ix-tab.active {
  border-bottom: 2.5px solid var(--purple);
  margin-bottom: -1px;
}

.ix-tab.secondary { padding-left: 28px; }
.ix-tab.secondary strong { color: var(--text-mid); }
.ix-tab-divider {
  width: 1px;
  background: var(--border);
  margin: 12px 0;
}

/* ── Panel body ── */
.ix-panel-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 0;
  padding: 24px 28px;
  background: var(--white);
}

/* ── Column grid ── */
.ix-cols {
  display: grid;
  gap: 8px;
}
.ix-cols--four { grid-template-columns: repeat(4, minmax(0,1fr)); }

.ix-col-head {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-light);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
  font-family: 'AlmadenSans para';
}

/* ── Menu item ── */
.ix-item {
  display: flex;
  align-items: center;
  gap: 11px;
  text-decoration: none;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  margin-bottom: 2px;
  transition: background .18s ease;
  cursor: pointer;
}
.ix-item:hover,
.ix-item.active { background: var(--purple-bg); }

.ix-item-icon {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 9px;
  background: var(--purple-icon);
  color: var(--purple);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .18s ease;
}
.ix-item:hover .ix-item-icon,
.ix-item.active .ix-item-icon {
  background: var(--purple);
  color: #fff;
}
.ix-item-icon svg { width: 18px; height: 18px; }

.ix-item-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
  line-height: 1.3;
  font-family: 'AlmadenSans para';
}
.ix-item:hover .ix-item-label,
.ix-item.active {
    color: var(--text-dark);
}

/* ── Preview card ── */
.ix-preview {
  padding-left: 20px;
  border-left: 1px solid var(--border);
  margin-left: 8px;
}
.ix-preview img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: var(--radius-md);
  display: block;
  margin-bottom: 14px;
}
.ix-preview-body h3,
.ix-preview-body .ix-preview-title {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dark);
  text-decoration: none;
  margin-bottom: 8px;
  line-height: 1.3;
  font-family: 'AlmadenSans para';
}
.ix-preview-body .ix-preview-title:hover {
  color: var(--brand-purple, #50269E);
}
.ix-preview-body p {
  font-size: 13px;
  color: var(--text-mid);
  line-height: 1.6;
  margin-bottom: 14px;
  font-family: 'AlmadenSans para';
}
.ix-preview-link {
  font-size: 13px;
  font-weight: 600;
  color: var(--purple);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: gap .2s ease;
  font-family: 'AlmadenSans para';
}
.ix-preview-link:hover { gap: 8px; }

/* ── Footer bar ── */
.ix-footer-bar {
  display: flex;
  align-items: stretch;
  background: #f6f7fb;
  border-top: 1px solid var(--border);
  padding: 0 28px;
  gap: 0;
}
.ix-footer-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  padding: 14px 20px 14px 0;
  margin-right: 28px;
  border-right: 1px solid var(--border);
  transition: .2s ease;
  flex-shrink: 0;
}
.ix-footer-link:last-child { border-right: none; margin-right: 0; }
.ix-footer-link:hover .ix-footer-icon { background: var(--purple); color: #fff; }
.ix-footer-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 9px;
  background: var(--purple-icon);
  color: var(--purple);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .2s ease;
}
.ix-footer-icon svg { width: 17px; height: 17px; }
.ix-footer-link strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 2px;
  font-family: 'AlmadenSans para';
}
.ix-footer-link small {
  display: block;
  font-size: 11.5px;
  color: var(--text-light);
  font-family: 'AlmadenSans para';
}

/* ── Responsive ── */
@media (max-width: 1200px) {
  .ix-cols--four { grid-template-columns: repeat(2, 1fr); }
  .ix-panel-body { grid-template-columns: 1fr 240px; }
}
@media (max-width: 900px) {
  .ix-panel-body { grid-template-columns: 1fr; }
  .ix-preview { border-left: none; padding-left: 0; border-top: 1px solid var(--border); padding-top: 16px; margin-top: 8px; }
  .ix-dropdown-row { padding: 0 16px; }
}
@media (max-width: 640px) {
  .ix-cols--four { grid-template-columns: 1fr; }
  .ix-footer-bar { flex-direction: column; }
  .ix-footer-link { border-right: none; border-bottom: 1px solid var(--border); padding-right: 0; margin-right: 0; }
  .ix-footer-link:last-child { border-bottom: none; }
  .ix-tab-strip { flex-direction: column; }
  .ix-tab-divider { display: none; }
}

/* ── Services mega-menu: category-driven layout ──
   Col 1 = category buttons (.ix-svc-nav / .ix-cat); cols 2-3 = the active
   category's services in a 2-col grid (.ix-svc-lists / .ix-svc-group); col 4 =
   the existing .ix-preview (unchanged). Driven by mega-menu.js: hover/click a
   category to reveal its group and refresh the preview. Odoo active by default. */
.ix-panel-body--svc { grid-template-columns: 240px minmax(0,1fr) 280px; }
.ix-svc-nav { display: flex; flex-direction: column; gap: 2px; padding-right: 18px; margin-right: 6px; border-right: 1px solid var(--border); }
.ix-cat {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; text-align: left;
  background: transparent; border: 0; cursor: pointer;
  padding: 10px 12px; border-radius: var(--radius-sm);
  font-family: 'AlmadenSans para'; font-size: 13px; font-weight: 600; line-height: 1.3;
  color: var(--text-dark); transition: background .18s ease, color .18s ease;
}
.ix-cat::after {
  content: ""; flex: 0 0 auto; width: 7px; height: 7px;
  border-right: 2px solid currentColor; border-top: 2px solid currentColor;
  transform: rotate(45deg); opacity: .4;
  transition: opacity .18s ease, transform .18s ease;
}
.ix-cat:hover, .ix-cat.active { background: var(--purple-bg); color: var(--purple); }
.ix-cat:hover::after, .ix-cat.active::after { opacity: 1; transform: rotate(45deg) translate(1px,-1px); }
.ix-svc-lists { min-width: 0; }
.ix-svc-group { display: none; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 14px; align-content: start; }
.ix-svc-group.active { display: grid; }
@media (max-width: 1200px) {
  .ix-panel-body--svc { grid-template-columns: 204px minmax(0,1fr) 240px; }
}
@media (max-width: 900px) {
  .ix-panel-body--svc { grid-template-columns: 1fr; }
  .ix-svc-nav { flex-direction: row; flex-wrap: wrap; gap: 6px; border-right: none; border-bottom: 1px solid var(--border); padding: 0 0 10px; margin: 0 0 10px; }
  .ix-cat { width: auto; }
}
@media (max-width: 640px) {
  .ix-svc-group.active { grid-template-columns: 1fr; }
}

/* home page menu css end*/

/* ===== Index World header integration (theme-specific, not part of the ported mega-menu) ===== */
.ix-site-header{ position:fixed; top:0; left:0; right:0; z-index:100; background:transparent; border-bottom:1px solid transparent; transition:background .4s ease, box-shadow .4s ease, border-color .4s ease, -webkit-backdrop-filter .4s ease, backdrop-filter .4s ease; }
/* once scrolled: frosted-glass bar (80% white + blur), matching staging */
.ix-site-header.is-scrolled{ background:rgba(255,255,255,.8); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px); border-bottom-color:rgba(0,0,0,.05); box-shadow:0 4px 12px rgba(0,0,0,.05); }
.ix-site-header.is-scrolled .custom-logo{ filter:none !important; }
.ix-site-header.is-scrolled .ix-main-item > a,
.ix-site-header.is-scrolled .ix-plain{ color:var(--text-dark); }
.ix-site-header .ix-bar{ align-items:center; min-height:78px; padding-block:12px; padding-inline:24px; }
/* Above 1408px the 1360 max-width centering already provides ≥24px side gap, so drop the
   extra padding to keep the desktop logo/nav aligned with the page content below. */
@media (min-width:1408px){ .ix-site-header .ix-bar{ padding-inline:0; } }
.ix-site-header .custom-logo{ display:block; position:relative; top:-5px; }   /* optically align logo wordmark with the menu baseline */
.ix-nav{ flex:1; display:flex; align-items:center; justify-content:space-between; margin-left:40px; }
.ix-nav__left{ display:flex; align-items:center; gap:26px; }
.ix-nav__right{ display:flex; align-items:center; gap:22px; }
.ix-nav .ix-mega-menu-wrapper{ width:auto; }            /* don't let it consume the whole row */
.ix-plain{ text-decoration:none; color:var(--text-dark); font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; font-weight:500; transition:color .15s ease, background .15s ease; white-space:nowrap; }
.ix-plain:hover{ color:var(--purple); }
/* current-page highlight: the nav link for the page you're on gets the lavender pill (added by nav-active.js) */
.ix-nav .ix-plain.is-current{ background:#ECE6FF;  padding:9px 16px; border-radius:10px; font-weight:600; }
.home .ix-site-header .ix-plain.is-current{ background:#ECE6FF;  }
/* Contact Us = staging .contact_us_nav_button (light lavender), Get free Demo = #50269E. Same size, 14px/600. */
.ix-btn-outline{ display:inline-flex; align-items:center; justify-content:center; background:#ECE6FF; color:#000; border:none; text-decoration:none; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:14px; line-height:1; min-height:46px; padding:0 20px; border-radius:12px; transition:.15s ease; white-space:nowrap; }
.ix-btn-outline:hover{ background:#ece6ffcc; }
/* Contact Us drops to a plain link (no border/fill) when another menu link owns the current page (nav-active.js) */
.ix-btn-outline.is-dim{ background:transparent; color:var(--text-dark); box-shadow:none; }
.ix-btn-outline.is-dim:hover{ background:transparent; color:var(--purple); }
.ix-cta-btn{ display:inline-flex; align-items:center; justify-content:center; background:#50269E; color:#fff !important; text-decoration:none; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:14px; line-height:1; min-height:46px; padding:0 20px; border-radius:12px; transition:background .15s ease; white-space:nowrap; }
.ix-cta-btn:hover{ background:#50269ec9; }

/* Current header sits on white → use dark trigger text (the white variant is for the future home hero). */
.ix-site-header .ix-main-item > a{ color:var(--text-dark); font-size:15px; }
.ix-site-header .ix-main-item > a:hover{ color:var(--purple); }
/* keep .active state as-is (purple pill, white text) */

/* Re-anchor the dropdown to the full-width header so it centers in the viewport
   (staging hardcoded width:1360px; left:-160px tuned to its own navbar geometry). */
.ix-site-header .ix-mega-menu-wrapper{ position:static; width:auto; }
.ix-site-header .ix-dropdown-row{ left:0; right:0; width:auto; top:calc(100% + 16px); }

/* keep the active trigger's label white on the purple pill (my dark-text override above must not win here) */
.ix-site-header .ix-main-item.active > a{ color:#fff; }

/* ============================= Homepage hero ============================= */
.ix-hero{
	position:relative;
	background: radial-gradient(ellipse 400% 240% at 50% 100%, #fff, #fff 10%, 15%, #c7c5fd 16%, #9a67fa99 17%, 21%, #50269e 28%, 35%, #00031d 45%, #00031d);
	color:#fff;
	/* match staging EXACTLY: the banner is ~1171px tall (taller than the viewport — you
	   scroll into it). The radial gradient is percentage-based, so content must sit at the
	   same proportion as staging: headline/buttons in the top ~45% (on purple), leaving the
	   bottom ~55% as the white bloom that the Case Studies carousel overlaps up into.
	   A shorter box pushes the buttons down into the white — which is the bug we just had. */
	min-height:1171px;
	display:flex;
	flex-direction:column;
	padding:90px 24px 0;
	overflow:hidden;
	text-align:center;
}
.ix-hero__inner{ max-width:860px; margin-inline:auto; }

/* announcement bar — staging style: full-bleed band, centered text + Explore, dismiss ✕ at right */
.ix-annc{
	border-radius:12px;
	margin:0 40px 30px; padding:12px 56px 12px 24px;
	display:flex; align-items:center; justify-content:center; gap:16px;
	background:rgba(255,255,255,.06); 
	position:relative;
}
.ix-annc__text{ color:#fff; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; font-weight:600; white-space:nowrap; }
.ix-annc__cta{   /* exact staging .hpBanner_registerNow */
	background:linear-gradient(279deg,#FB327E 5.28%,#0B5CFF 176.96%); color:#fff; text-decoration:none;
	font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:14px; line-height:1;
	padding:8px 18px; border-radius:12px; white-space:nowrap; transition:filter .15s ease;
}
.ix-annc__cta:hover{ filter:brightness(1.08); }
.ix-annc__close{
	position:absolute; right:18px; top:50%; transform:translateY(-50%);
	background:none; border:none; color:rgba(255,255,255,.7);
	font-size:22px; line-height:1; cursor:pointer; padding:0;
}
.ix-annc__close:hover{ color:#fff; }
@media (max-width:700px){
	/* keep the announcement on ONE line on mobile */
	.ix-annc{ flex-wrap:wrap; gap:8px; padding:10px 40px 10px 14px; margin:0 12px 20px; }
	.ix-annc__text{ white-space:normal; font-size:12px; line-height:1.35; text-align:center; }
	.ix-annc__cta{ font-size:12px; padding:6px 12px; }
	.ix-annc__close{ right:12px; }
}
.ix-hero__title{
	color:#fff !important;
	font-family:'index happy font',Inter,sans-serif;
	font-size:2.9rem; line-height:1.29; font-weight:700;   /* staging exact .hero h1 (60px/46.4px) */
	letter-spacing:-.01em; margin:0 auto 24px;
}
.ix-hero__sub{
	color:rgba(255,255,255,.88); font-size:1.125rem; line-height:1.6; font-weight:400;
	letter-spacing:-0.035rem; max-width:620px; margin:0 auto 34px;
}

/* hero CTAs */
.ix-hero__actions{ gap:14px; }
.ix-hero__btn .wp-block-button__link{
	display:inline-flex; align-items:center; justify-content:center;
	font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1;
	min-height:54px; padding:0 28px; border-radius:12px; transition:filter .15s ease, background .15s ease;
}
.ix-hero__btn--dark .wp-block-button__link{ background:#00053D; color:#fff; }
.ix-hero__btn--dark .wp-block-button__link:hover{ background:#0a1050; }
.ix-hero__btn--white .wp-block-button__link{ background:#fff; color:#0d1224; }
.ix-hero__btn--white .wp-block-button__link:hover{ background:#f0ebff; }

/* client-card carousel — static, arrow-navigated (staging shows 5 across) */
.ix-hero__carousel{ position:relative; margin-top:60px; padding:0 24px; }
.ix-hero__viewport{ overflow:hidden; }
.ix-hero__track{ display:flex; gap:20px; transition:transform .45s cubic-bezier(.4,0,.2,1); will-change:transform; }
.ix-hero__card{ flex:0 0 auto; width:260px; }
.ix-hero__card img{ width:100%; height:auto; border-radius:20px; display:block; box-shadow:0 20px 55px rgba(0,0,0,.38); }
.ix-hero__arrow{
	position:absolute; top:50%; transform:translateY(-50%); z-index:4;
	width:54px; height:54px; border-radius:50%; border:none; cursor:pointer;
	background:#ECE6FF; color:#00053D;
	display:flex; align-items:center; justify-content:center; transition:background .15s ease, opacity .15s ease;
	box-shadow:0 6px 20px rgba(0,5,61,.18);
}
.ix-hero__arrow:hover{ background:#fff; }
.ix-hero__arrow--prev{ left:10px; }
.ix-hero__arrow--next{ right:10px; }
.ix-hero__arrow:disabled{ opacity:.45; cursor:default; }

@media (max-width:900px){
	/* On mobile the desktop 1171px height (which leaves room for the overlapping
	   carousel) just creates a huge blank white gap, and the bright-white bottom of
	   the radial gradient washes out the subtitle/buttons. So on mobile: size the hero
	   to its content, and end the gradient on purple/lavender (no white bloom) so the
	   text stays readable and it transitions cleanly into the white Case Studies
	   section that stacks right below. */
	.ix-hero{
		/* NO min-height on mobile — this is the whole fix. With a fixed 880px box the
		   content height (which changes every width as the headline/subtitle rewrap) sat
		   at a different point each time, so a fixed negative-margin overlap on .ix-cases
		   hit the buttons at some widths and left a big gap at others. Letting the hero
		   size to its content makes the buttons ALWAYS sit exactly padding-bottom above
		   the box bottom, so the cards' overlap (below) is a constant offset from the
		   buttons at every width — see .ix-cases note. padding-bottom keeps them on rich
		   purple; the radial gradient is unchanged. */
		min-height:0;
		padding:96px 18px 250px;
		/* Same gradient as desktop, only the CENTRE moves from 50% 100% to 50% 110%.
		   The bands are % of hero height and the carousel covers far less of the hero on
		   mobile (222px vs 640px), so the desktop anchor left the white/lavender core in
		   view. Dropping the centre 10% of the height below the bottom edge slides that
		   pale core down under the cards, so the visible hero reads purple like desktop.
		   Colours are byte-identical to the desktop stops — only the position differs.
		   (Still too pale? push to 115% / 120%.) */
		background:radial-gradient(ellipse 400% 240% at 50% 110%,#fff,#fff 10%,15%,#c7c5fd 16%,#9a67fa99 17%,21%,#50269e 28%,35%,#00031d 45%,#00031d);
	}
	/* zoom-style tight spacing: banner sits close under the header, headline close under it */
	.ix-annc{ margin-bottom:16px; }
	.ix-hero__inner{ margin-top:0; }
	.ix-hero__title{ font-size:2.125rem; line-height:1.09; }
	.ix-hero__card{ width:180px; }
}

/* phones: keep the two hero CTAs side-by-side (zoom-style) instead of stacking */
@media (max-width:600px){
	.ix-hero__actions{ flex-wrap:nowrap; gap:10px; width:100%; }
	.ix-hero__actions .wp-block-button{ flex:1 1 0; min-width:0; }
	.ix-hero__btn .wp-block-button__link{ width:100%; min-height:50px; padding:0 10px; font-size:14px; white-space:nowrap; text-align:center; }
}

/* ===== Home variant: header overlays the dark hero (transparent, white logo + nav) ===== */
.home .ix-site-header{ background:transparent; border-bottom:none; }
.home .ix-site-header .custom-logo{ filter:brightness(0) invert(1); }       /* dark logo -> white */
.home .ix-site-header .ix-main-item > a{ color:#fff; }
.home .ix-site-header .ix-main-item > a:hover{ color:#fff; opacity:.82; }
.home .ix-site-header .ix-plain{ color:#fff; }
.home .ix-site-header .ix-plain:hover{ color:#fff; opacity:.82; }
/* once scrolled, the home header turns solid white with dark text (override the transparent/white-text rules above) */
.home .ix-site-header.is-scrolled{ background:rgba(255,255,255,.8); border-bottom-color:rgba(0,0,0,.05); }
.home .ix-site-header.is-scrolled .ix-main-item > a,
.home .ix-site-header.is-scrolled .ix-plain{ color:var(--text-dark); }
.home .ix-site-header.is-scrolled .ix-main-item > a:hover{ color:var(--purple); opacity:1; }
/* An OPEN dropdown paints its trigger as a purple pill, so the label must stay
   white. The rule that does that (.ix-site-header .ix-main-item.active > a) is
   specificity 0,3,1 and was being beaten by the 0,4,1 scrolled rule above, which
   left dark navy text on the purple pill once you scrolled past 30px. These match
   the scrolled selector's specificity so the open state wins again. Hover is
   listed too, otherwise hovering an already-open trigger flips it back to purple
   on purple. */
.home .ix-site-header.is-scrolled .ix-main-item.active > a,
.home .ix-site-header.is-scrolled .ix-main-item.active > a:hover{ color:#fff; }
/* Contact Us keeps its lavender on the dark hero too (base style already works) */
/* mega-menu active pill + dropdown keep their own (dark-on-white) styles */

/* Header polish: clear the WP admin bar (logged-in) so the transparent home header isn't clipped, + breathing room */
.ix-site-header .ix-bar{ min-height:84px; padding-block:16px; }
.admin-bar .ix-site-header{ top:32px; }
@media screen and (max-width:782px){ .admin-bar .ix-site-header{ top:46px; } }

/* Fixed header is out of flow → offset page content; pull heroes up so the header overlays them */
.wp-site-blocks main{ padding-top:88px; }
.wp-site-blocks main > .ix-hero,
.wp-site-blocks main > .ix-ihero{ margin-top:-88px; }

/* ===== Industries tabs section (scoped from staging) ===== */
.ix-industries { --bg: #f5f6fa;       --card: #ffffff;       --text: #1f2937;       --muted: #6b7280;       --border: #e5e7eb;       --accent: #4f46e5;       --accent2: #3b82f6;       --radius: 18px;       --shadow: 0 10px 24px rgba(0, 0, 0, .08); }
.ix-industries * { box-sizing: border-box; }
.ix-industries .industry-tabs { display: grid;       grid-template-columns: 250px 1fr;       gap: 24px; }
.ix-industries .tabs-panel { display: flex;       flex-direction: column;       gap: 10px; }
.ix-industries .tab-btn { width: 100%;       border: 0;       background: transparent;       text-align: left;       display: flex;       align-items: center;       gap: 10px;       padding: 12px 12px;       border-radius: 14px;       cursor: pointer;       font-weight: 600;       color: #374151;        transition:         background 0.3s ease,         color 0.3s ease,         transform 0.25s ease,         box-shadow 0.25s ease; }
.ix-industries .tab-btn:hover { background: #ECE6FF;       color: #000;       transform: translateY(-3px);       box-shadow: 0 8px 18px rgba(79, 70, 229, 0.15); }
.ix-industries .tab-btn.active { background: #ECE6FF;       color: #111827;       border: 1px solid var(--border);       transform: translateY(-2px) scale(1.02);       box-shadow: 0 5px 15px rgba(79, 70, 229, 0.2); }
.ix-industries .tab-icon { width: 26px;       height: 26px;       display: grid;       place-items: center;       flex: 0 0 26px;       color: #111827; }
.ix-industries .tab-label { font-size: 14px;       line-height: 1.2;       white-space: nowrap;       font-family: 'AlmadenSans para'; }
.ix-industries .content-panel { background: #ECE6FF;       padding: 24px;       border-radius: var(--radius);       min-height: 520px;       display: flex;       flex-direction: row;       gap: 24px;       height: fit-content;        position: sticky;       top: 90px; }
.ix-industries .card { background: var(--card);       border-radius: var(--radius);       box-shadow: var(--shadow);       border: 1px solid rgba(0, 0, 0, .04);       overflow: hidden; }
.ix-industries .card-pad { padding: 20px; }
.ix-industries .title { margin: 0 0 8px 0;       font-size: 22px;       font-weight: 800;       letter-spacing: -.01em; }
.ix-industries .desc { margin: 0;       color: var(--muted);       font-size: 16px;       line-height: 1.35;       font-family: 'AlmadenSans para'; }
.ix-industries .info-card { display: flex;       flex-direction: column;       justify-content: space-between;       gap: 14px;       height: fit-content;       flex: 1; }
.ix-industries .card-pad-mini { display: flex;       flex-direction: row;       justify-content: center;       height: 405px; }
.ix-industries .mini-illustration { width: 100%;       max-width: 380px;       object-fit: contain; }
.ix-industries .image-card { display: flex;       flex-direction: column;       justify-content: space-between;       gap: 18px;       flex: 1; }
.ix-industries .image-card img { width: 100%;       height: 380px;       object-fit: cover;       display: block;       border-radius: var(--radius); }
.ix-industries .help-card { background: linear-gradient(180deg, #50269e, #001e67);       color: #fff;       border: 0; }
.ix-industries .help-card .desc { color: rgba(255, 255, 255, .85); }
.ix-industries .help-card .title { color: #fff; }
/* Explore CTA: promoted from an inline underlined link to a full-width button on its
   own line at the bottom of the help card (2026-08). White pill on the dark-purple
   card, our Standard button tier (14px/600, radius 12). Full-width + centered so every
   industry tab's button is the SAME width and long labels ("Office Furniture") wrap
   cleanly instead of overflowing a nowrap pill. Glow dropped — the button is the
   emphasis now, one clear CTA. */
.ix-industries .help-card .ix-ind-link { display:flex;       align-items:center;       justify-content:center;       gap:6px;       width:100%;       margin-top:14px;       background:#fff;       color:#50269e;       font-family:'AlmadenSans para',Inter,sans-serif;       font-weight:600;       font-size:14px;       line-height:1.25;       min-height:44px;       padding:10px 16px;       border-radius:12px;       text-align:center;       text-decoration:none;       transition:transform .18s ease, box-shadow .18s ease, color .18s ease; }
.ix-industries .help-card .ix-ind-link:hover { transform:translateY(-2px);       box-shadow:0 8px 20px rgba(0,0,0,.28);       color:#3a1c77; }
@media (max-width: 900px) {
.ix-industries .industry-tabs { grid-template-columns: 1fr;         gap: 14px; }
.ix-industries .tabs-panel { flex-direction: row;         gap: 10px;         overflow-x: auto;         overflow-y: hidden;         padding: 4px 2px 10px;         -webkit-overflow-scrolling: touch;         scroll-snap-type: x mandatory; }
.ix-industries .tabs-panel::-webkit-scrollbar { display: none; }
.ix-industries .tab-btn { width: auto;         flex: 0 0 auto;         padding: 10px 12px;         border-radius: 14px;         background: #ffffff;         border: 1px solid rgba(0,0,0,.06);         box-shadow: none;         transform: none;         scroll-snap-align: start; }
.ix-industries .tab-btn:hover { transform: none; }
.ix-industries .tab-btn.active { border-color: rgba(80,38,158,.35);         box-shadow: none; }
.ix-industries .tab-label { font-size: 13px; }
.ix-industries .content-panel { position: static;         top: auto;         min-height: auto;         flex-direction: column;         padding: 14px;         gap: 14px; }
.ix-industries .image-card img { height: 220px;         display: none !important; }
.ix-industries .card-pad-mini { height: auto;         padding-bottom: 12px; }
.ix-industries .mini-illustration { max-width: 100%; }
.ix-industries .title { font-size: 18px; }
.ix-industries .desc { font-size: 14px; }
}

/* ===== Industries section wrapper (heading + subheading) ===== */
.ix-industries-section{ padding:50px 24px; background:#fff; }
.ix-sec-title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; line-height:1.15; font-weight:600; color:var(--text-dark); margin:0 auto 14px; max-width:1120px; text-wrap:balance; }
.ix-sec-sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.125rem; line-height:1.55; color:var(--text-mid); max-width:760px; margin:0 auto 46px; }
.ix-industries{ max-width:1250px; margin:0 auto; }
@media (max-width:900px){ .ix-industries-section{ padding:60px 20px; } .ix-sec-title{ font-size:2rem; } }

/* ===== About Index World section ===== */
.ix-about{ padding:50px 24px; background:#fff; }
.ix-about__row{ gap:48px; align-items:center; }
.ix-about__title{ text-align:left; margin:0 0 18px; }
.ix-about__body{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.125rem; line-height:1.5; color:var(--text-mid); margin:0 0 28px; }
.ix-cta-fill .wp-block-button__link{ background:#50269E; color:#fff; font-family:Inter,sans-serif; font-weight:600; font-size:14px; line-height:1; border-radius:10px; padding:13px 26px; }
.ix-cta-fill .wp-block-button__link:hover{ background:#50269ec9; }
.ix-about__photos{ display:flex; gap:16px; justify-content:center; align-items:flex-start; }
.ix-about__photos figure{ margin:0; flex:1 1 0; max-width:200px; }
.ix-about__photos img{ width:100%; aspect-ratio:2/3; height:auto; border-radius:16px; display:block; object-fit:cover; object-position:center; box-shadow:0 16px 40px rgba(13,18,36,.12); }
.ix-about__photos figure:nth-child(2){ margin-top:40px; }
.ix-about__photos figure:nth-child(3){ margin-top:14px; }
@media (max-width:900px){
	.ix-about{ padding:56px 20px; }
	.ix-about__photos figure{ margin-top:0 !important; }
	/* stacked on mobile: center the text column */
	.ix-about__title{ text-align:center; }
	.ix-about__body{ text-align:center; }
	.ix-about__row .wp-block-buttons{ justify-content:center; }
}

/* ===== Built on Trusted Platforms — partner logo marquee (zt-* from staging) ===== */
.ix-trusted{ padding:50px 24px; background:#fff; overflow-x:clip; }   /* contain the 100vw marquee so it can't cause page-wide horizontal scroll */
/* staging renders this section compact — small heading (20px) + 18px subtitle, NOT the big 46px section title */
.ix-trusted .ix-sec-title{ font-size:20px; line-height:1.25; font-weight:600; color:#000; margin-bottom:10px; }
.ix-trusted .ix-sec-sub{ font-size:18px; color:#000; max-width:820px; margin-bottom:0; }
/* full-bleed: break the marquee out of the section's 1200px container to span the whole viewport */
/* The full-bleed margins need !important. Where this marquee sits inside a
   .wp-block-group.alignfull section, WordPress own alignfull rule wins and
   computes margin-left:0 / margin-right:-48px -- so the strip starts at the
   section left padding and runs 24px past the right edge, where the section
   overflow-x:clip cuts it off. Measured +24px over at 320/360/768/1024
   (2026-08-28), i.e. tablet and small desktop too, not just phones. With
   !important the calc resolves symmetrically (-24/-24 at 360) and the strip is
   edge-to-edge again. No width tested regressed. */
.zt-trust{ width:100vw; max-width:100vw; margin-left:calc(50% - 50vw)!important; margin-right:calc(50% - 50vw)!important; margin-top:48px; }
.zt-trust__inner{ width:100%; overflow:hidden; position:relative;
	-webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	        mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.zt-trust__track{ display:flex; flex-wrap:nowrap; align-items:center; width:max-content; gap:80px; animation:zt-marquee 22s linear infinite; will-change:transform; }
.zt-trust__inner:hover .zt-trust__track{ animation-play-state:paused; }
.zt-logo{ flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.zt-logo img{ width:135px; max-width:none; height:auto; display:block; filter:grayscale(100%); opacity:.95; transition:transform .25s ease, filter .25s ease, opacity .25s ease; }
.zt-logo img:hover{ transform:scale(1.08); filter:grayscale(0%); opacity:1; }
@keyframes zt-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (max-width:767px){ .zt-logo img{ width:120px; } }

/* ===== From the Blog (Query Loop) ===== */
.ix-blog{ padding:50px 24px; background:#f7f7fb; }
.ix-blog__eyebrow{ display:flex; justify-content:center; margin:0 0 16px; }
.ix-industries__eyebrow{ display:flex; justify-content:center; margin:0 0 16px; }
.ix-eyebrow{ color:var(--purple); font-family:Inter,sans-serif; font-weight:700; font-size:13px; letter-spacing:.09em; text-transform:uppercase; margin:0 0 8px; }
.ix-blog .ix-sec-title{ margin-bottom:40px; }
.ix-blog__grid .wp-block-post-template{ gap:26px; }
.ix-blog__card{ background:#fff; border:1px solid var(--border); border-radius:18px; overflow:hidden; padding:0; transition:box-shadow .2s ease, transform .2s ease; }
.ix-blog__card:hover{ box-shadow:0 18px 44px rgba(13,18,36,.10); transform:translateY(-4px); }
.ix-blog__card .wp-block-post-featured-image{ margin:0; }
.ix-blog__card .wp-block-post-featured-image img{ width:100%; height:200px; object-fit:cover; display:block; }
.ix-blog__title{ font-family:'index happy font',Inter,sans-serif; font-size:1.18rem; line-height:1.25; font-weight:600; margin:18px 20px 10px; }
.ix-blog__title a{ color:var(--text-dark); text-decoration:none; }
.ix-blog__title a:hover{ color:var(--purple); }
.ix-blog__excerpt{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.95rem; line-height:1.55; color:var(--text-mid); margin:16px 20px 12px; }   /* canonical card excerpt spacing — matches the /blog/ (.ix-bloglist) card so Related Blogs + homepage carousel align identically */
.ix-blog__excerpt .wp-block-post-excerpt__more-link{ display:inline-block; margin-top:8px; color:var(--purple); font-weight:600; text-decoration:none; }
.ix-blog__excerpt .wp-block-post-excerpt__more-link:hover{ text-decoration:underline; }
@media (max-width:900px){ .ix-blog{ padding:56px 20px; } }

/* ===== Footer (pixel-matched to staging) ===== */
.ix-footer{ background:linear-gradient(346deg,#00053D 40.29%,#000111 100%); color:#fff; padding:72px 24px 30px; }
.ix-footer__inner{ max-width:1360px; margin:0 auto; display:grid; grid-template-columns:400px 1fr; gap:56px; align-items:stretch; }

/* LEFT: tall brand card */
.ix-fbrand{ border:2px solid rgba(255,255,255,.12); border-radius:24px; padding:28px; display:flex; flex-direction:column; }
.ix-fbrand__logo{ width:215px; height:auto; display:block; }
.ix-fbrand__tag{ margin:14px 0 26px; font-size:13px; color:rgba(255,255,255,.6); font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-fcontact{ display:flex; align-items:center; gap:14px; text-decoration:none; margin-bottom:18px; }
.ix-fcontact__ic{ flex:0 0 auto; width:50px; height:50px; border-radius:50%; background:#50269E; color:#fff; display:flex; align-items:center; justify-content:center; }
.ix-fcontact__txt{ display:flex; flex-direction:column; line-height:1.3; }
.ix-fcontact__txt small{ font-size:12px; color:rgba(255,255,255,.55); font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-fcontact__txt strong{ font-size:16px; color:#fff; font-weight:600; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-fdivider{ height:1px; background:rgba(255,255,255,.1); margin:8px 0 20px; }
.ix-fpartners__head{ margin:0 0 16px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.45); font-family:Inter,sans-serif; }
.ix-fpartners{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:nowrap; }
.ix-fpartners img{ width:auto; height:auto; object-fit:contain; flex:0 0 auto; }
.ix-fpartners img[alt="Claude"]{ width:96px; }
.ix-fpartners img[alt="Odoo Partner"]{ width:72px; }
.ix-fpartners img[alt="Sage"]{ width:64px; }
.ix-fpartners img[alt="QuickBooks"]{ width:50px; }
.ix-fsocial__head{ margin:0 0 16px; font-size:16px; color:#fff; font-family:'index happy font',Inter,sans-serif; }
.ix-fsocial{ display:flex; gap:14px; }
.ix-fsocial a{ width:51px; height:51px; border:2px solid rgba(255,255,255,.12); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; text-decoration:none; transition:background .15s ease, border-color .15s ease; }
.ix-fsocial a:hover{ background:#50269E; border-color:#50269E; }

/* RIGHT: link columns + office cards + bottom bar */
.ix-footer__main{ display:flex; flex-direction:column; }
.ix-fcols{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.ix-fcol{ display:flex; flex-direction:column; }
.ix-fcol h3{ color:#fff; font-family:Inter,sans-serif; font-size:18px; font-weight:400; margin:0 0 22px; }
.ix-fcol a{ color:#fff; text-decoration:none; font-size:15px; font-weight:500; margin-bottom:16px; font-family:'AlmadenSans para',Inter,sans-serif; transition:opacity .15s ease; }
.ix-fcol a:hover{ opacity:.7; }
.ix-fcol__body{ display:flex; flex-direction:column; }   /* links wrapper (added by footer-accordion.js); expanded by default — only collapses ≤600 */
.ix-fhr{ height:1px; background:rgba(255,255,255,.1); margin:30px 0 28px; }
.ix-foffices{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
/* Footer office cards — staging-parity hover animation: lift + border/bg strengthen
   + 3px gradient top bar (fade-in on hover; always on for HQ, amber). */
.ix-foffice{ position:relative; overflow:hidden; border-radius:16px; padding:22px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); transition:transform .3s ease, border-color .3s ease, background .3s ease; }
.ix-foffice::before{ content:""; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg,transparent,rgba(123,108,255,.65),transparent); opacity:0; transition:opacity .3s ease; }
.ix-foffice:hover{ transform:translateY(-5px); border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.06); }
.ix-foffice:hover::before{ opacity:1; }
.ix-foffice--hq{ background:rgba(245,166,35,.08); border-color:rgba(245,166,35,.35); }
.ix-foffice--hq::before{ background:linear-gradient(90deg,transparent,#F5A623,transparent); opacity:1; }
.ix-foffice__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.ix-fflag{ width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; font-size:22px; }
.ix-fbadge{ padding:6px 11px; border-radius:999px; font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; background:rgba(123,108,255,.16); color:#cfc8ff; border:1px solid rgba(123,108,255,.35); font-family:Inter,sans-serif; }
.ix-fbadge--hq{ background:#F5A623; color:#2a1c00; border:none; }
.ix-foffice h3{ color:#fff; font-family:'index happy font',Inter,sans-serif; font-size:19px; font-weight:800; margin:0 0 8px; }
.ix-foffice p{ margin:0; color:rgba(255,255,255,.65); font-size:13.5px; line-height:1.5; font-family:'AlmadenSans para',Inter,sans-serif; }
/* footer address links to the matching office on /contact-us/. Keep the muted footer
   colour (not global purple, which is unreadable on the dark footer); brighten + underline on hover. */
.ix-foffice__link{ color:inherit; text-decoration:none; }
.ix-foffice__link:hover{ color:#fff; text-decoration:underline; text-underline-offset:2px; }
.ix-fbar{ display:flex; align-items:center; justify-content:space-between; margin-top:26px; font-size:12px; color:rgba(255,255,255,.85); font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-fbar a{ color:rgba(255,255,255,.85); text-decoration:none; }
.ix-fbar a:hover{ color:#fff; }
@media (max-width:1100px){ .ix-footer__inner{ grid-template-columns:minmax(0,1fr); gap:32px; } .ix-fcols{ grid-template-columns:1fr 1fr; } .ix-foffices{ grid-template-columns:1fr; } .ix-foffice{ transition:none; } .ix-foffice:hover{ transform:none; } }
@media (max-width:600px){ .ix-fcols{ grid-template-columns:1fr; gap:0; } .ix-fbar{ flex-direction:column; gap:8px; align-items:flex-start; }
	/* footer link columns become tap-to-open accordions (matches staging) */
	.ix-fcol{ border-bottom:1px solid rgba(255,255,255,.12); }
	.ix-fcol h3{ display:flex; align-items:center; justify-content:space-between; margin:0; padding:0 2px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
	/* 2026-09-15: the tap target is the <button> footer-accordion.js puts inside the heading; it carries the 18px vertical padding the heading used to have, so the row height is unchanged. */
	.ix-fcol__btn{ flex:1 1 auto; min-width:0; padding:18px 0; margin:0; border:0; background:none; text-align:left; font:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
	.ix-fcol h3::after{ content:""; width:9px; height:9px; border-right:2px solid rgba(255,255,255,.7); border-bottom:2px solid rgba(255,255,255,.7); transform:rotate(45deg); transition:transform .3s ease; margin-right:4px; margin-top:-4px; flex:0 0 auto; }
	.ix-fcol.open h3::after{ transform:rotate(-135deg); margin-top:2px; }
	.ix-fcol__body{ max-height:0; overflow:hidden; transition:max-height .38s ease; }
	.ix-fcol.open .ix-fcol__body{ max-height:640px; padding-bottom:12px; }
	.ix-fcol a{ margin-bottom:14px; }
}

/* --- Footer overflow on small phones (2026-08-27).
   The brand card's partner-logo row is flex-wrap:nowrap with four fixed widths
   (96+72+50+50 = 268px, +36px of gaps = 304px), so .ix-fbrand's min-content was
   355.2px. As a grid item with the default min-width:auto it could not shrink, which
   pinned the single-column track at 355.2px inside a 335.2px container -- and
   .ix-footer__main (min-content just 104px) got stretched to match, pushing the link
   columns, the office cards and the bottom bar 20px past the viewport, where
   overflow-x:clip cut them off. Broke on anything under ~395px: 375 and 360 phones.
   min-width:0 lets the grid items shrink to the track; the logo row keeps its single
   line (deliberate -- see memory/footer-build.md) and scales down instead of wrapping.
   Verified clean at 320/360/375/414/430; 768 and 1440 unchanged. */
.ix-footer__inner > *{ min-width:0; }
@media (max-width:420px){
	.ix-fpartners{ gap:8px; }
	.ix-fpartners img[alt="Claude"]{ width:80px; }
	.ix-fpartners img[alt="Odoo Partner"]{ width:60px; }
	.ix-fpartners img[alt="Sage"]{ width:52px; }
	.ix-fpartners img[alt="QuickBooks"]{ width:41px; }
}
@media (max-width:340px){
	.ix-fpartners{ gap:6px; }
	.ix-fpartners img[alt="Claude"]{ width:70px; }
	.ix-fpartners img[alt="Odoo Partner"]{ width:52px; }
	.ix-fpartners img[alt="Sage"]{ width:46px; }
	.ix-fpartners img[alt="QuickBooks"]{ width:36px; }
}

/* ===== Services suite (tabbed) ===== */
.ix-services{ padding:50px 24px; background:#fff; }
/* decorative purple gem sparkle above the eyebrow (staging) */
.ix-svc__spark{ display:flex; justify-content:center; margin-bottom:6px; }
.ix-svc__spark img{ width:40px; height:auto; display:block; }
.ix-svc__eyebrow{ display:flex; justify-content:center; margin-bottom:16px; }
/* Tabbed Services component — ONE consistent header spacing for every usage
   (Our Tool Stack, Key Benefits, and the ERP/service pages): heading→sub 12px,
   sub→content 34px. Single source of truth; variants no longer override spacing. */
.ix-services .ix-sec-title{ margin-bottom:12px; }
.ix-services .ix-sec-sub{ margin-bottom:34px; }
/* Key Benefits keeps only its wider subtitle measure; spacing inherits the component. */
.ix-keyben .ix-sec-sub{ max-width:780px; margin:0 auto 34px; text-align:center; }
.ix-svc__tabs{ display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-bottom:38px; }
/* tab pills — staging: AlmadenSans 500, light-grey resting, lavender + animated spinning gradient border when active */
@property --ix-angle{ syntax:"<angle>"; inherits:false; initial-value:0deg; }
@keyframes ix-tab-spin{ to{ --ix-angle:360deg; } }
.ix-svc__tab{ position:relative; z-index:0; border:0; background:#F6F6F6; color:var(--text-dark); font-family:'AlmadenSans para',Inter,sans-serif; font-weight:500; font-size:16px; padding:13px 22px; border-radius:12px; cursor:pointer; transition:background .15s ease, color .15s ease; }
.ix-svc__tab:hover{ background:#ECE6FF; }
.ix-svc__tab.active{ background:#ECE6FF; overflow:hidden; box-shadow:0 4px 14px rgba(80,38,158,.12); }
.ix-svc__tab.active::before{ content:""; position:absolute; inset:-1px; border-radius:12px; background:conic-gradient(from var(--ix-angle), #50269E, #fff, #50269E); animation:ix-tab-spin 2s linear infinite; z-index:-2; }
.ix-svc__tab.active::after{ content:""; position:absolute; inset:1px; border-radius:11px; background:#ECE6FF; z-index:-1; }
.ix-svc__panel{ display:none; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.ix-svc__panel.active{ display:grid; }
.ix-svc__item{ margin:0 0 20px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px; line-height:1.5; color:var(--text-mid); }
.ix-svc__item strong{ color:var(--text-dark); font-weight:700; }
.ix-svc__item a{ color:#50269E; text-decoration:none; }
.ix-svc__item a:hover{ text-decoration:underline; text-underline-offset:2px; }
.ix-svc__arrow{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; min-width:24px; border-radius:50%; background:#f2f2f7; color:var(--text-dark); vertical-align:middle; margin-left:3px; transition:.15s ease; }
.ix-svc__arrow:hover{ background:var(--purple); color:#fff; }
/* normalize every tab image to the SAME fixed 16:9 box (staging reference) so square diagrams and wide graphics all render at an identical size */
.ix-svc__media{ display:flex; align-items:center; justify-content:center; }
.ix-svc__media img{ width:100%; aspect-ratio:16/9; height:auto; object-fit:cover; object-position:center; border-radius:14px; display:block; }
@media (max-width:900px){ .ix-services{ padding:56px 20px; } .ix-svc__panel.active{ grid-template-columns:1fr; } .ix-svc__media{ order:-1; } }

/* ===== Reviews + Testimonial (review cards: colored platform logos + "Read reviews on …") ===== */
/* top padding is 30px: the preceding .ix-trusted adds 70px bottom padding, so the
   visible gap above "Client Reviews" lands at 100px total (70 + 30). */
.ix-proof{ padding:30px 24px 90px; background:#fff; }
.ix-proof__head{ max-width:720px; margin:0 auto 46px; text-align:center; }
.ix-proof__head .badge-wrapper{ justify-content:center; margin:0 0 18px; }
.ix-proof__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; line-height:1.15; font-weight:600; color:var(--text-dark); margin:0 0 14px; }
.ix-proof__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:18px; line-height:1.5; color:var(--text-mid); margin:0; }

.ix-ratings{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1120px; margin:0 auto 64px; }
/* each platform is a card: colored logo, gold stars, score, count, then a purple "Read reviews" link pinned to the bottom */
.ix-rating{ display:flex; flex-direction:column; align-items:center; text-align:center; background:#fff; border:1px solid var(--border); border-radius:20px; padding:38px 28px 30px; box-shadow:0 2px 14px rgba(13,18,36,.04); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.ix-rating:hover{ transform:translateY(-6px); box-shadow:0 24px 50px rgba(13,18,36,.10); border-color:#e0d8f5; }
/* brand row: icon + platform name on one centered, vertically-aligned line */
.ix-rating__brand{ display:flex; align-items:center; justify-content:center; gap:11px; height:34px; margin-bottom:22px; }
.ix-rating__logo{ width:auto; flex:0 0 auto; object-fit:contain; display:block; }
.ix-rating__name{ font-family:'index happy font',Inter,sans-serif; font-size:21px; font-weight:600; line-height:1; color:var(--text-dark); }
.ix-rating__stars{ display:flex; justify-content:center; gap:4px; margin-bottom:14px; }
.ix-rating__star{ fill:#FFB400; }
.ix-rating__score{ font-family:'index happy font',Inter,sans-serif; font-size:2.6rem; font-weight:700; color:var(--text-dark); line-height:1; margin-bottom:6px; }
.ix-rating__score span{ font-size:1.1rem; font-weight:600; color:var(--text-light); }
.ix-rating__count{ font-size:14px; color:var(--text-light); font-family:'AlmadenSans para',Inter,sans-serif; margin-bottom:22px; }
.ix-rating__cta{ display:inline-flex; align-items:center; gap:7px; margin-top:auto; font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; font-weight:600; color:var(--purple); text-decoration:none; }
.ix-rating__cta svg{ transition:transform .25s ease; }
.ix-rating__cta:hover{ text-decoration:underline; }
.ix-rating:hover .ix-rating__cta svg{ transform:translateX(4px); }

@media (max-width:980px){ .ix-ratings{ grid-template-columns:1fr 1fr; } .ix-proof__title{ font-size:34px; } }
@media (max-width:680px){ .ix-proof{ padding:60px 20px 70px; } .ix-ratings{ grid-template-columns:1fr; max-width:420px; gap:18px; } .ix-proof__title{ font-size:28px; } .ix-proof__sub{ font-size:16px; } }

/* ===== Customer Stories carousel (.ix-cstory) — one testimonial per view (portrait + content) ===== */
/* vertical padding matches the source section (--padding-top:30px / --padding-bottom:100px);
   24px side gutter kept for responsiveness (source relies on inner-widget padding instead). */
.ix-cstory{ padding:30px 24px 100px; background:#fff; }
.ix-cstory__head{ text-align:center; max-width:900px; margin:0 auto 50px; }
.ix-cstory__head .badge-wrapper{ justify-content:center; margin:0 0 18px; }
.ix-cstory__title{ font-family:'index happy font',Inter,sans-serif; font-size:46px; line-height:1.12; font-weight:600; color:var(--text-dark); margin:0; }

.ix-cstory__viewport{ overflow:hidden; }
.ix-cstory__track{ display:flex; transition:transform .55s cubic-bezier(.22,.61,.36,1); will-change:transform; cursor:grab; }
.ix-cstory__track:active{ cursor:grabbing; }
.ix-cstory__slide{ flex:0 0 100%; min-width:0; display:grid; grid-template-columns:minmax(0,500px) 1fr; gap:90px; align-items:center; padding:8px 4px; touch-action:pan-y; }
.ix-cstory__media{ background:#000; border-radius:24px; overflow:hidden; aspect-ratio:25/23; display:flex; align-items:center; justify-content:center; }
.ix-cstory__media img{ width:100%; height:100%; object-fit:cover; object-position:center top; -webkit-user-drag:none; user-select:none; }
.ix-cstory__content{ min-width:0; }
.ix-cstory__logo{ display:block; width:auto; max-width:300px; object-fit:contain; margin:0 0 26px; }
.ix-cstory__name{ font-family:'index happy font',Inter,sans-serif; font-size:32px; line-height:1.1; font-weight:600; color:var(--text-dark); margin:0 0 8px; }
.ix-cstory__name span{ color:var(--purple); }
.ix-cstory__role{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:18px; font-weight:500; color:var(--text-mid); margin:0 0 24px; }
.ix-cstory__quote{ font-family:'AlmadenSans para',Inter,sans-serif; font-style:italic; font-size:18px; line-height:1.5; color:var(--text-mid); margin:0; max-width:372px; }

.ix-cstory__nav{ display:flex; align-items:center; gap:16px; max-width:1120px; margin:46px auto 0; }
.ix-cstory__arrow{ flex:0 0 auto; width:56px; height:56px; border-radius:50%; border:0; cursor:pointer; background:#ECE6FF; color:#060038; display:inline-flex; align-items:center; justify-content:center; padding:0; transition:background .2s ease; }
.ix-cstory__arrow:hover{ background:#ddd2ff; }
.ix-cstory__dots{ flex:1; display:flex; justify-content:center; align-items:center; gap:16px; }
.ix-cstory__dot{ width:10px; height:10px; border:0; padding:0; border-radius:50%; background:#D6D1E8; cursor:pointer; transition:width .3s, background .3s; }
.ix-cstory__dot.is-active{ width:26px; border-radius:5px; background:#060038; }

@media (max-width:980px){
	.ix-cstory__title{ font-size:36px; }
	.ix-cstory__slide{ grid-template-columns:1fr; gap:30px; justify-items:center; text-align:center; }
	.ix-cstory__media{ width:100%; max-width:460px; aspect-ratio:25/23; }
	.ix-cstory__content{ max-width:560px; }
	.ix-cstory__logo{ margin-left:auto; margin-right:auto; }
	.ix-cstory__quote{ margin-left:auto; margin-right:auto; }
}
@media (max-width:560px){
	.ix-cstory{ padding:20px 18px 64px; }
	.ix-cstory__title{ font-size:28px; }
	.ix-cstory__name{ font-size:26px; }
	.ix-cstory__role, .ix-cstory__quote{ font-size:16px; }
	.ix-cstory__arrow{ width:46px; height:46px; }
	.ix-cstory__nav{ gap:10px; margin-top:34px; }
}

/* ===== Mobile / responsive header (hamburger) ===== */
.ix-burger{ display:none; }
@media (max-width:1024px){
	.ix-burger{ display:flex; flex-direction:column; gap:5px; width:44px; height:44px; align-items:center; justify-content:center; background:none; border:none; cursor:pointer; padding:0; position:relative; z-index:70; color:var(--text-dark); }
	.home .ix-burger{ color:#fff; }
	/* when the menu is open the header turns solid white (staging) so the dark burger reads cleanly */
	.ix-site-header.nav-open{ background:#fff !important; -webkit-backdrop-filter:none; backdrop-filter:none; border-bottom-color:rgba(0,0,0,.06); }
	.ix-site-header.nav-open .custom-logo{ filter:none !important; }
	.ix-site-header.nav-open .ix-burger{ color:var(--text-dark); }
	.ix-burger span{ display:block; width:24px; height:2px; background:currentColor; border-radius:2px; transition:transform .25s ease, opacity .2s ease; }
	.ix-site-header.nav-open .ix-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
	.ix-site-header.nav-open .ix-burger span:nth-child(2){ opacity:0; }
	.ix-site-header.nav-open .ix-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

	/* mobile menu — staging design: white, full-width dropdown below the header, black AlmadenSans 14/500 links */
	.ix-nav{ position:absolute; top:100%; left:0; right:0; width:100%; max-height:calc(100vh - 100%); overflow-y:auto; background:#fff; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; padding:10px 0 24px; margin-left:0; border-top:1px solid rgba(0,0,0,.06); box-shadow:0 24px 40px rgba(0,0,0,.10); opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .22s ease, transform .22s ease, visibility 0s linear .22s; z-index:59; }
	.ix-site-header.nav-open .ix-nav{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity .22s ease, transform .22s ease, visibility 0s; }
	.ix-nav__left, .ix-nav__right{ flex-direction:column; align-items:stretch; gap:0; width:100%; }
	.ix-nav__right{ margin-top:10px; gap:10px; padding:12px 20px 0; }
	.ix-nav .ix-mega-menu-wrapper{ width:100%; position:static; }
	.ix-nav .ix-mega-menu{ display:flex; flex-direction:column; align-items:stretch; width:100%; }
	.ix-main-menu{ flex-direction:column; align-items:stretch; width:100%; gap:0; }
	li.ix-main-item{ width:100%; }
	.ix-dropdown-row{ display:none !important; }
	.ix-site-header .ix-main-item > a{ color:#00053D !important; font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px !important; font-weight:600 !important; padding:13px 24px !important; display:flex; align-items:center; justify-content:space-between; }
	.ix-site-header .ix-main-item > a .ix-chevron{ transform:rotate(-90deg); }
	.ix-site-header .ix-main-item.active > a{ background:none; }
	.ix-nav .ix-plain{ color:#00053D !important; font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px; font-weight:600; padding:13px 24px; }
	.ix-nav .ix-plain.is-current{ background:#ECE6FF; }
	.ix-nav .ix-btn-outline, .ix-nav .ix-cta-btn{ width:auto; justify-content:center; margin:0 24px; }
}

/* ============================================================
   Case Studies — white intro card over a carousel of client cards
   (sits directly under the hero; matches staging.indexworld.net)
   ============================================================ */
.ix-cases{ background:transparent; padding:40px 0 0px; overflow:hidden; position:relative; z-index:2; margin-top:-555px; }
.ix-cases__inner{ position:relative; }   /* full-bleed: carousel spans the whole viewport width, cards bleed off both edges */

/* Carousel viewport + track */
.ix-cases__viewport{ overflow:hidden; padding-top:40px; margin-top:-10px; padding-bottom:30px; margin-bottom:-30px; touch-action:pan-y; cursor:grab; }
.ix-cases__viewport:active{ cursor:grabbing; }
.ix-cases__card img{ -webkit-user-drag:none; user-select:none; }
.ix-cases__track{
	display:flex; gap:24px; padding-left:0;
	transition:transform .55s cubic-bezier(.22,.61,.36,1); will-change:transform;
	/* 2026-09-21: start parked on card 2 in CSS, the exact spot case-studies.js moves it to.
	   Before this the first paint showed card 1 and the script slid card 2 in after the
	   whole body script chain ran, so the mobile LCP waited on JavaScript (PSI 19 Sep: 5.1 s). */
	transform:translateX(-324px);
}
.ix-cases__card{
	flex:0 0 auto; width:300px; border-radius:18px; overflow:hidden;
	background:#eef0f5; box-shadow:0 14px 34px rgba(0,5,61,.10);
	display:block; text-decoration:none; cursor:pointer;
	transition:transform .3s ease, box-shadow .3s ease;
}
/* lift only on real mouse devices — never on touch (it makes the swipe jump) */
@media (hover:hover){ .ix-cases__card:hover{ transform:translateY(-30px); box-shadow:0 28px 50px rgba(0,5,61,.16); } }
.ix-cases__card img{
	display:block; width:100%; height:auto; aspect-ratio:1081/1331; object-fit:cover;
}

/* White intro card overlaying the left of the full-bleed carousel (aligns to a centered 1280 content edge) */
.ix-cases__intro{
	position:absolute; left:max(24px, calc((100% - 1232px) / 2)); top:50%; transform:translateY(-50%);
	width:340px; background:#fff; border-radius:22px; padding:38px 34px;
	box-shadow:0 24px 60px rgba(0,5,61,.16); z-index:3;
}
.ix-cases__eyebrow{ margin:0 0 12px -12px; }   /* badge wrapper; -12 offsets the badge's left padding */
.ix-cases__title{
	margin:0 0 28px; font-weight:700; font-size:30px; line-height:1.18; color:#001433;
}
.ix-cases__cta{ display:flex; align-items:center; gap:12px; }

/* Navigation row: prev arrow at far left · dots centered · next arrow at far right */
.ix-cases__nav{
	display:flex; align-items:center; justify-content:space-between; gap:20px;
	margin:40px auto 0; max-width:1232px; padding:0 24px; position:relative;
}
.ix-cases__arrow{
	display:inline-flex; align-items:center; justify-content:center;
	width:54px; height:54px; border-radius:50%; background:#ECE6FF; color:#00053D;
	border:0; cursor:pointer; transition:background .2s ease, opacity .2s ease;
}
.ix-cases__arrow:hover{ background:#ddd2ff; }
.ix-cases__arrow:disabled{ opacity:.4; cursor:default; }
.ix-cases__dots{
	display:flex; align-items:center; gap:16px;
	position:absolute; left:50%; transform:translateX(-50%);
}
/* dots match the .ix-iccar style: grey-lavender circles, dark-navy active pill */
.ix-cases__dot{
	width:10px; height:10px; padding:0; border:0; border-radius:50%;
	background:#D6D1E8; cursor:pointer; transition:width .3s ease, background .3s ease;
}
.ix-cases__dot:hover{ background:#b3a6dd; }
.ix-cases__dot.is-active{ width:26px; border-radius:5px; background:#060038; }
.ix-cases__dots--intro{ display:none; }   /* shown only inside the card on mobile */

@media (max-width:900px){
	/* mobile — clean professional layout:
	   cards rise into the hero's white bloom (swipe + autoplay), then a centered
	   "Case Studies" card sits directly below. No dots, no arrows, nothing overlapping. */
	/* The hero gradient is percentage-based, so where content sits in the box decides
	   which colour band it lands on. Desktop keeps content high via its own
	   padding-bottom (370-400px, min-width:901px only); mobile had none, so the taller
	   wrapped headline sank into the pale #c7c5fd band and the hero read washed out.
	   padding-bottom grows the box to push content back onto purple; the deeper
	   .ix-cases overlap then covers more of the white bottom bloom (desktop covers
	   640px, mobile was only covering 380px). */
	/* Cards rise into the hero's bottom by a CONSTANT amount. Because the hero has no
	   min-height on mobile (above), its bottom is always 250px (padding-bottom) below the
	   buttons — so this -222px overlap always leaves the same 28px gap between the buttons
	   and the top of the carousel, at 320px, 400px, 418px, 430px, every width. No more
	   per-width breakage: gap = hero padding-bottom (250) - overlap (222) = 28px, a value
	   that no longer depends on how the headline wraps. */
	.ix-cases{ padding:0 0 56px; margin-top:-222px; background:transparent; }
	/* inner is the flex column: cards on top, the Case Studies card centered below.
	   width/overflow clamp it to the screen so the wide carousel track can't stretch it
	   (otherwise centering references a too-wide box and the card drifts right). */
	.ix-cases__inner{ display:flex; flex-direction:column; align-items:center; width:100%; max-width:100vw; }
	.ix-cases__viewport{ width:100%; min-width:0; padding-top:0; margin-top:0; padding-bottom:0; margin-bottom:0; }
	/* the Case Studies card overlaps UP into the cards so the two read as one section,
	   and it carries the autoplay dots inside it */
	.ix-cases__intro{
		position:relative; z-index:4; transform:none; left:auto; right:auto; top:auto;
		width:min(100% - 36px, 360px); margin:-100px 0 0;
		padding:28px 26px; text-align:center; box-shadow:0 18px 44px rgba(0,5,61,.16);
	}
	.ix-cases__eyebrow{ display:flex; justify-content:center; margin:0 0 12px; }
	.ix-cases__title{ font-size:24px; line-height:1.22; margin:0 0 22px; }
	.ix-cases__cta{ justify-content:center; }
	/* centered active card with a peek of the prev/next on BOTH sides: card is 78vw and the
	   track gets symmetric side padding so each snapped card lands in the middle */
	.ix-cases__card{ width:78vw; max-width:none; }
	.ix-cases__track{ gap:14px; padding-left:11vw; padding-right:11vw; transform:translateX(calc(-89vw - 14px)); }
	/* dots live inside the card — tappable to jump to a slide (like the cannabis carousel) */
	.ix-cases__dots--intro{ display:flex; justify-content:center; position:static; transform:none; margin:22px 0 0; }
	/* no arrows / no separate nav row on mobile */
	.ix-cases__nav{ display:none; }
}

/* ============================================================
   Industries landing grid — all industry cards → detail pages
   ============================================================ */
.ix-indgrid-section{ padding:72px 24px 88px; background:#fff; }
.ix-indgrid__eyebrow{ display:flex; justify-content:center; margin:0 0 12px; }
.ix-indgrid-section .ix-sec-sub{ margin-bottom:48px; }
.ix-indgrid{
	display:grid; grid-template-columns:repeat(4, 1fr); gap:30px 24px;
	max-width:1250px; margin:0 auto;
}
.ix-indcard{
	display:flex; flex-direction:column; text-decoration:none;
	background:transparent; transition:transform .25s ease;
}
.ix-indcard:hover{ transform:translateY(-4px); }
/* smaller thumbnail image with its own rounded frame */
.ix-indcard__img{
	position:relative; display:block; aspect-ratio:16/11;
	border-radius:16px; overflow:hidden; background:#0b0f24;
	box-shadow:0 10px 26px rgba(0,5,61,.10); transition:box-shadow .25s ease;
}
.ix-indcard:hover .ix-indcard__img{ box-shadow:0 20px 44px rgba(0,5,61,.18); }
.ix-indcard__img img{ width:100%; height:100%; object-fit:cover; display:block;
	transition:transform .45s ease; }
.ix-indcard:hover .ix-indcard__img img{ transform:scale(1.06); }
/* label row sits OUTSIDE / below the image, dark text on white */
.ix-indcard__bar{
	position:static; display:flex; align-items:center; justify-content:space-between;
	gap:10px; padding:14px 4px 0; color:#00053d; background:none;
}
.ix-indcard__name{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1.25; }
.ix-indcard__arrow{
	flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
	width:32px; height:32px; border-radius:50%; background:#ECE6FF;
	color:#50269E; transition:background .2s ease, transform .2s ease, color .2s ease;
}
.ix-indcard:hover .ix-indcard__arrow{ background:var(--purple,#50269E); color:#fff; transform:translateX(3px); }
@media (max-width:1100px){
	.ix-indgrid{ grid-template-columns:repeat(3, 1fr); }
}
@media (max-width:760px){
	.ix-indgrid{ grid-template-columns:repeat(2, 1fr); gap:22px 16px; }
	.ix-indgrid-section{ padding:52px 18px 60px; }
}
@media (max-width:380px){
	.ix-indgrid{ grid-template-columns:1fr; }
}

/* ============================================================
   Single-industry page sections (hero / what-is / challenges /
   key benefits / how-it-works). Shared: .ix-sec-title, .ix-sec-sub.
   ============================================================ */

/* Industry hero — left copy, right image */
.ix-ihero{ padding:140px 24px 72px; background:#fff; }   /* matches staging hero top spacing */
.ix-ihero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; max-width:1200px; margin:0 auto; }
.ix-ihero__title{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:50px; line-height:1.05; color:#000; margin:10px 0 22px; }   /* staging: 50px/700 */
.ix-ihero__sub{ font-family:'AlmadenSans para',Inter,sans-serif; color:var(--text-mid,#4a4f63); font-size:18px; line-height:1.6; margin:0 0 16px; max-width:560px; }
.ix-ihero__checks{ list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 28px; max-width:600px; }
.ix-ihero__checks li{ display:flex; align-items:flex-start; gap:10px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.98rem; line-height:1.35; color:#1b1d2b; }
.ix-ihero__check{ flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:#ECE6FF; color:#50269E; display:inline-flex; align-items:center; justify-content:center; margin-top:1px; }
.ix-ihero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:26px; }
.ix-ihero__btn{ display:inline-flex; align-items:center; justify-content:center; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1; min-height:54px; padding:0 28px; border-radius:12px; text-decoration:none; transition:filter .15s ease, background .15s ease; }
.ix-ihero__btn--primary{ background:var(--purple,#50269E); color:#fff; }
.ix-ihero__btn--primary:hover{ filter:brightness(1.08); }
.ix-ihero__btn--ghost{ background:#ECE6FF; color:#0a0a14; }
.ix-ihero__btn--ghost:hover{ background:#ddd2ff; }
.ix-ihero__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; border-radius:22px; display:block; box-shadow:0 24px 60px rgba(0,5,61,.16); }

/* What is Index World for [Industry] — image left, copy right */
.ix-iwhat{ padding:72px 24px; background:#f7f7fb; }
.ix-iwhat__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:54px; align-items:center; max-width:1200px; margin:0 auto; }
/* Grid items default to min-width:auto, so any child with a wide min-content (a nested
   auto-fit grid, a long unbroken string, a wide table) drags the whole track past the
   viewport instead of shrinking. min-width:0 keeps the columns honest. */
.ix-iwhat__grid > *{ min-width:0; }
/* Media column stretches to the text height — lets this section use a tall/long image
   (cover-crops to fill, section height driven by the copy, never by the image). */
.ix-iwhat__media{ align-self:stretch; min-height:0; }
.ix-iwhat__media img{ width:100%; height:100%; min-height:360px; object-fit:cover; object-position:center; border-radius:22px; display:block; box-shadow:0 20px 50px rgba(0,5,61,.12); }
.ix-iwhat__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:40px; line-height:1.15; color:var(--text-dark,#0d1224); margin:0 0 18px; }
.ix-iwhat__copy p{ font-family:'AlmadenSans para',Inter,sans-serif; color:var(--text-mid,#4a4f63); font-size:18px; line-height:1.65; margin:0 0 16px; }
.ix-iwhat__h3{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:18px; color:var(--text-dark,#0d1224); margin:24px 0 8px; }

/* Industry challenges — flat 3-col cards w/ large purple icons (pixel-matched to staging) */
.ix-ichal{ padding:72px 24px; background:#fff; }
.ix-ichal__eyebrow{ display:flex; justify-content:center; margin:0 0 12px; }
.ix-ichal .ix-sec-title{ margin-bottom:50px; }
.ix-ichal--withsub .ix-sec-title{ margin-bottom:14px; }
/* ...and do it automatically 2026-08-25. The 50px above is right when the heading sits
   straight on top of the tile grid, and wrong when a sub-paragraph comes between them:
   there it opens a gap that reads as a missing element. --withsub fixes that but has to
   be remembered, and it was missing on seven sections across five industry pages. Worse,
   it cannot always be added by hand: several pages carry two .ix-ichal sections under the
   identical class, one with a sub and one without, so a class edit would tighten the wrong
   one too. Keying off the sub itself is exact and needs no per-page markup. --withsub stays
   supported for the pages that already declare it. */
.ix-ichal .ix-sec-title:has(+ .ix-sec-sub, + .ix-ichal__sub){ margin-bottom:14px; }
.ix-ichal__sub{ max-width:760px; margin:0 auto 50px; }
.ix-ichal__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:44px 50px; max-width:1114px; margin:0 auto; }   /* staging: card 338, gap 50 */
.ix-ichal__card{ padding:24px; text-align:center; }
.ix-ichal__icon{ width:85px; height:85px; color:#50269E; margin:0 auto 18px; display:flex; align-items:center; justify-content:center; }
.ix-ichal__icon svg{ width:72px; height:72px; }
.ix-ichal__h3{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:22px; line-height:1.2; color:#000; margin:0 0 12px; }
.ix-ichal__p{ font-family:'AlmadenSans para',Inter,sans-serif; color:#3a3a4a; font-size:18px; line-height:1.5; margin:0; }

/* Key benefits — numbered grid on dark band */
.ix-ibenefits{ padding:76px 24px; background:linear-gradient(180deg,#16103a 0%, #0b0f24 100%); }
.ix-ibenefits .ix-sec-title{ color:#fff !important; margin-bottom:40px; }
.ix-ibenefits__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; max-width:1200px; margin:0 auto; }
.ix-ibenefits__card{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:30px 24px; }
.ix-ibenefits__num{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:2rem; color:#9a67fa; display:block; margin-bottom:14px; }
.ix-ibenefits__h3{ font-family:Inter,sans-serif; font-weight:700; font-size:1.12rem; color:#fff; margin:0 0 10px; }
.ix-ibenefits__p{ font-family:'AlmadenSans para',Inter,sans-serif; color:rgba(255,255,255,.74); font-size:.96rem; line-height:1.55; margin:0; }

/* How it works — numbered vertical timeline */
/* How It Works — two-column copy block (text + step checklist + CTA | image), matched to staging */
.ix-ihow{ padding:80px 24px; background:#fff; }
.ix-ihow__grid{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.05fr 1fr; gap:60px; align-items:center; }
.ix-ihow__text{ min-width:0; }
.ix-ihow__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; line-height:1.18; font-weight:600; color:#0b0b0b; margin:0 0 18px; }
.ix-ihow__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:18px; line-height:1.6; color:#3a3a4a; margin:0 0 28px; }
.ix-ihow__list{ list-style:none; margin:0 0 30px; padding:0; display:flex; flex-direction:column; gap:18px; }
.ix-ihow__item{ display:flex; gap:14px; align-items:flex-start; }
.ix-ihow__check{ flex:0 0 26px; width:26px; height:26px; border-radius:50%; background:#ECE6FF; color:#50269E; display:flex; align-items:center; justify-content:center; margin-top:1px; }
.ix-ihow__copy strong{ display:block; font-family:'index happy font',Inter,sans-serif; font-size:17px; font-weight:600; color:#16182b; margin-bottom:3px; }
.ix-ihow__copy span{ display:block; font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; line-height:1.6; color:#5a5a6a; }
.ix-ihow__media{ min-width:0; }
.ix-ihow__media img{ width:100%; height:auto; aspect-ratio:680/480; object-fit:cover; border-radius:20px; display:block; }

@media (max-width:900px){
	.ix-ihero{ padding:48px 18px; }
	.ix-ihero__grid{ grid-template-columns:1fr; gap:32px; }
	.ix-ihero__title{ font-size:2.2rem; }
	.ix-ihero__checks{ grid-template-columns:1fr; gap:10px; }
	.ix-ihero__media{ order:-1; }
	.ix-iwhat{ padding:48px 18px; }
	.ix-iwhat__grid{ grid-template-columns:1fr; gap:28px; }
	.ix-iwhat__media{ order:-1; align-self:auto; }
	.ix-iwhat__media img{ height:auto; min-height:0; aspect-ratio:4/3; }
	.ix-iwhat__title{ font-size:2rem; }
	.ix-ichal{ padding:48px 18px; }
	.ix-ichal__grid{ grid-template-columns:1fr; }
	.ix-ibenefits{ padding:52px 18px; }
	.ix-ibenefits__grid{ grid-template-columns:1fr 1fr; }
	.ix-ihow{ padding:52px 18px; }
	.ix-ihow__grid{ grid-template-columns:1fr; gap:30px; }
	.ix-ihow__title{ font-size:1.9rem; }
}
@media (max-width:560px){
	.ix-ibenefits__grid{ grid-template-columns:1fr; }
}

/* ====== Feature Tabs (slider) — vertical tabs (desktop) / dots + swipe (mobile). All scoped to .ix-ftabs ====== */
.ix-ftabs{ padding:64px 48px 72px; background:#f7f6f8; font-family:'AlmadenSans para',Inter,sans-serif; color:#1a1a2e; }
.ix-ftabs__inner{ max-width:1304px; margin:0 auto; }   /* matches staging: 1400 section − 2×48 padding = 1304 content (slide ≈ 996) */
.ix-ftabs__title{ font-size:40px; font-weight:600; color:#0d1224; line-height:1.25; margin:0 auto 40px; max-width:840px; text-align:center; font-family:'index happy font',Inter,sans-serif; }   /* 40px = the .ix-sec-title section-heading standard (four of the homepage H2s); was 46px */
.ix-ftabs__layout{ display:grid; grid-template-columns:330px 1fr; gap:0; align-items:start; }

/* Left vertical tabs (desktop) */
.ix-ftabs .tabs-col{ display:flex; flex-direction:column; padding-top:120px; position:relative; z-index:2; }
.ix-ftabs .tab-btn{ background:none; border:none; cursor:pointer; text-align:left; padding:18px 28px 20px 20px; border-radius:10px; transition:background .25s ease; display:flex; flex-direction:column; gap:7px; outline:none; width:100%; margin-bottom:2px; }
.ix-ftabs .tab-btn:not(.active):hover{ background:rgba(0,0,0,.04); }
.ix-ftabs .tab-btn.active{ background:#50269E; }
/* ===== Button style fix 2026-08-04 =====
   <button> does not inherit font-family from its ancestors, so these tabs fell back to the
   UA default (Arial 400 13.33px) even though .ix-ftabs sets the house face. Align family,
   radius and motion with .ix-btn. .ix-industries .tab-btn has the identical bug. */
.ix-ftabs .tab-btn, .ix-industries .tab-btn{ font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-ftabs .tab-btn{ border-radius:12px; transition:background .25s ease, transform .25s ease, box-shadow .25s ease; }
.ix-ftabs .tab-btn:not(.active):hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(80,38,158,.10); }
.ix-ftabs .tab-btn.active{ box-shadow:0 6px 18px rgba(80,38,158,.22); }
@media (prefers-reduced-motion: reduce){
  .ix-ftabs .tab-btn{ transition:none; }
  .ix-ftabs .tab-btn:not(.active):hover{ transform:none; box-shadow:none; }
}
.ix-ftabs .tab-label{ font-size:1rem; font-weight:600; color:#888; line-height:1.3; transition:color .25s; }
.ix-ftabs .tab-btn.active .tab-label{ color:#fff; }
.ix-ftabs .tab-sub{ font-size:.84rem; color:rgba(255,255,255,.82); line-height:1.35; display:none; }
.ix-ftabs .tab-btn.active .tab-sub{ display:block; }

/* Slider */
.ix-ftabs .slides-outer{ touch-action:pan-y; overflow:hidden; border-radius:18px; margin-left:-22px; position:relative; z-index:1; box-shadow:0 4px 32px rgba(0,0,0,.07); }
.ix-ftabs .slides-track{ display:flex; transition:transform .58s cubic-bezier(.25,.46,.45,.94); will-change:transform; }
.ix-ftabs .slide{ flex:0 0 100%; min-width:0; display:flex; flex-direction:row; background:#fff; min-height:620px; }   /* matches staging card height */
.ix-ftabs .slide-image{ flex:0 0 44%; position:relative; overflow:hidden; background:#ddd; }
.ix-ftabs .slide-image img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.ix-ftabs .slide-content{ flex:1; padding:40px 44px 40px 40px; display:flex; flex-direction:column; justify-content:center; overflow-y:auto; }
.ix-ftabs .slide-desc{ font-size:.97rem; color:#3a3a4a; line-height:1.55; margin-bottom:24px; font-weight:400; }
.ix-ftabs .products-list{ list-style:none; display:flex; flex-direction:column; gap:20px; }
.ix-ftabs .product-item{ display:flex; align-items:flex-start; gap:14px; }
.ix-ftabs .prod-icon{ width:36px; height:36px; min-width:36px; border-radius:50%; background:#50269E; display:flex; align-items:center; justify-content:center; margin-top:1px; }
.ix-ftabs .prod-icon svg{ width:18px; height:18px; fill:#fff; }
.ix-ftabs .prod-name{ font-size:.92rem; font-weight:600; color:#50269E; margin-bottom:3px; }
.ix-ftabs .prod-desc{ font-size:.82rem; color:#555; line-height:1.45; }

/* Dots (tablet + mobile) */
.ix-ftabs .carousel-dots{ display:none; justify-content:center; align-items:center; gap:10px; margin-top:24px; margin-bottom:24px; }
.ix-ftabs .dot{ width:12px; height:12px; border-radius:50%; background:#d4d2dc; cursor:pointer; transition:background .25s ease, transform .2s ease; border:none; padding:0; flex-shrink:0; }
.ix-ftabs .dot.active{ background:#50269E; transform:scale(1.15); }
.ix-ftabs .dot:not(.active):hover{ background:#b0adc0; }

@media (max-width:1100px){
	.ix-ftabs__title{ font-size:2rem; }
	.ix-ftabs__layout{ grid-template-columns:1fr; }
	.ix-ftabs .tabs-col{ display:none; }
	.ix-ftabs .carousel-dots{ display:flex; }
	/* house carousel recipe: full-bleed viewport, centered card with side peeks */
	.ix-ftabs{ padding-left:0; padding-right:0; }
	.ix-ftabs__title{ padding-left:28px; padding-right:28px; }
	.ix-ftabs__inner{ max-width:none; }
	.ix-ftabs .slides-outer{ margin-left:0; border-radius:0; box-shadow:none; background:transparent; }
	.ix-ftabs .slides-track{ gap:14px; padding-left:7vw; padding-right:7vw; }
	.ix-ftabs .slide{ flex:0 0 86vw; border-radius:18px; overflow:hidden; box-shadow:0 4px 32px rgba(0,0,0,.07); }
}
@media (max-width:860px){ .ix-ftabs{ padding:48px 0 60px; } }
@media (max-width:640px){
	.ix-ftabs{ padding:40px 0 52px; }
	.ix-ftabs__title{ margin-bottom:24px; padding-left:16px; padding-right:16px; }   /* font-size step moved to the shared 480px rule at the end of this file */
	.ix-ftabs .slide{ flex-direction:column; min-height:unset; }
	.ix-ftabs .carousel-dots{ margin-top:0; padding-top:30px; }
	.ix-ftabs .slide-image{ flex:none; width:100%; height:280px; }
	.ix-ftabs .slide-content{ padding:28px 16px 0; justify-content:flex-start; }
	.ix-ftabs .slide-desc{ font-size:15px; margin-bottom:20px; }
	.ix-ftabs .prod-name{ font-size:14px; }
	.ix-ftabs .prod-desc{ font-size:12.5px; }
}

/* FAQ — CENTERED eyebrow + heading + accordion (question left, plus/minus icon RIGHT, no dividers). Pixel-matched to staging cannabis-industry page. */
.ix-ifaq{ padding:72px 24px 84px; background:#fff; }
.ix-ifaq__inner{ max-width:900px; margin:0 auto; }
.ix-ifaq__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-ifaq__title{ text-align:center; margin-bottom:28px; }
.ix-ifaq__list{ display:flex; flex-direction:column; }
.ix-ifaq__q{ display:flex; align-items:center; justify-content:space-between; gap:24px; cursor:pointer; list-style:none; padding:20px 4px; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:500; font-size:20px; line-height:1.25; color:#1F2124; }
.ix-ifaq__q::-webkit-details-marker{ display:none; }
.ix-ifaq__qtext{ flex:1 1 auto; }
.ix-ifaq__ico{ flex:0 0 auto; width:14px; height:14px; color:#50269E; display:inline-flex; align-items:center; justify-content:center; }
.ix-ifaq__ico svg{ display:block; width:14px; height:14px; flex:0 0 auto; }
.ix-ifaq__ico-plus{ transition:transform .3s ease; }                 /* + rotates to × when open */
.ix-ifaq__item.is-open .ix-ifaq__ico-plus{ transform:rotate(45deg); }
/* smooth open/close via max-height — JS sets the open item's max-height to its EXACT scrollHeight
   (no 600px overshoot/snap). Scoped to .ix-ifaq--js so no-JS = a normal <details> accordion.
   NOTE: grid-template-rows:0fr→1fr resolves to 0px inside <details> in Chrome — do NOT use it here. */
.ix-ifaq--js .ix-ifaq__a{ overflow:hidden; max-height:0; transition:max-height .35s cubic-bezier(.4,0,.2,1); }
.ix-ifaq__a-in p{ font-family:'AlmadenSans para',Inter,sans-serif; color:#3a3a4a; font-size:16px; line-height:1.5; margin:0; padding:0 4px 20px; }

@media (max-width:900px){
	.ix-ifaq{ padding:48px 18px 56px; }
	.ix-ifaq__q{ font-size:18px; gap:16px; }
}

/* ===== Site-wide button standard (zoom format: 15/600, radius 12, ~46px) ===== */
/* ===== Zoom button system: Almaden Sans 600, radius 12. Large = 16px/54px (content & hero CTAs), Standard = 14px/46px (header/nav). ===== */
.ix-btn{ display:inline-flex; align-items:center; justify-content:center; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1; min-height:54px; padding:0 28px; border-radius:12px; text-decoration:none; cursor:pointer; border:0; transition:filter .15s ease, background .15s ease; }
.ix-btn--primary{ background:#50269E; color:#fff; }
.ix-btn--primary:hover{ filter:brightness(1.08); }
.ix-btn--light{ background:#ECE6FF; color:#0a0a14; border:1px solid rgba(80,38,158,.28); }
.ix-btn--light:hover{ background:#ddd2ff; border-color:rgba(80,38,158,.42); }

/* ===== Reusable section badge / label (icon + text) — shared across components ===== */
.badge-wrapper{ display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:8px; transition:all .3s ease; }
.badge-icon{ display:flex; flex:0 0 auto; }
.badge-icon img{ width:15px; height:15px; display:block; }
.badge-text{ font-family:'index happy font',Inter,sans-serif; font-size:14px; font-weight:600; color:#50269e; line-height:1; }

/* Plain CTA — navy centered TWO-LINE heading + primary/secondary buttons (staging CTA, used site-wide) */
.ix-ctap{ padding:84px 24px; background:#fff; }
.ix-ctap__inner{ max-width:900px; margin:0 auto; text-align:center; }
.ix-ctap__title{ font-family:'index happy font',Inter,sans-serif; font-size:32px; font-weight:600; line-height:1.15; color:#00053D; margin:0 auto 26px; max-width:560px; text-wrap:balance; }   /* balanced wrap: even lines at any headline length; 1.15 tightens the two-line gap */
.ix-ctap__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
@media (max-width:640px){ .ix-ctap{ padding:56px 18px; } .ix-ctap__title{ font-size:26px; max-width:320px; } }

/* ====== Image Card Carousel (staging "INDUSTRY SPECIFIC") — pixel-matched. Scoped to .ix-iccar ====== */
.ix-iccar{ padding:64px 24px 72px; background:#fff; }
.ix-iccar__head{ max-width:900px; margin:0 auto 44px; text-align:center; }
.ix-iccar__eyebrow{ display:flex; justify-content:center; margin:0 0 12px; }
.ix-iccar__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; font-weight:600; line-height:1.2; color:#000; margin:0 0 16px; }   /* 40px = the .ix-sec-title section-heading standard (four of the homepage H2s); was 46px */
.ix-iccar__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:18px; line-height:1.5; color:#3a3a4a; margin:0 auto; max-width:820px; }
/* grab/grabbing removed 2026-08-25 (owner, twice: "why hand sign appears", "still hand
   is coming"). This was the source of the hand - it sits on the viewport, so every child
   inherited it and the card titles and descriptions all rendered with the open hand.
   Dragging still works exactly as before; only the cursor hint is gone. NOTE: this is a
   deliberate deviation from carousel-guidelines, which specifies grab/grabbing as house
   style for every carousel - if that standard is ever reapplied wholesale, this page's
   decision has to be carried with it. */
.ix-iccar__viewport{ overflow:hidden; max-width:1360px; margin:0 auto; touch-action:pan-y; }
.ix-iccar__media{ -webkit-user-drag:none; user-select:none; }
.ix-iccar__track{ display:flex; gap:20px; transition:transform .55s cubic-bezier(.22,.61,.36,1); will-change:transform; }
.ix-iccar__card{ flex:0 0 325px; max-width:325px; }
.ix-iccar__media{ display:block; position:relative; width:100%; aspect-ratio:1/1; border-radius:21px; background-size:cover; background-position:center; overflow:hidden; text-decoration:none; }
.ix-iccar__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
/* Arrow overlay RESTORED 2026-08-14 (owner) — the card image is an <a> to the case
   study, but with no visible cue it did not read as clickable ("the arrow is not there,
   I can't click"). This is a persistent corner badge that signals the link; it sits
   top-right so it clears the top-left number badge (.ix-iccar__media::before, z-index:2).
   Whole image stays clickable; the badge is aria-hidden and purely a visual affordance. */
/* 2026-08-14 (owner): the badge is an affordance for a link, so it must only exist where
   there IS a link. .ix-iccar__media renders as <a href> on the service pages and as a plain
   <div> on the industry pages, where the cards are illustrative and go nowhere - and the badge
   was drawing a clickable-looking arrow on all of them. Hidden by default and switched on only
   inside a real anchor, so the rule is generic: any page, any card, no markup change. Colours
   also inverted to a white chip with a near-black glyph, which reads on any photograph
   (the solid purple chip disappeared against the darker images). */
.ix-iccar__arrow{
	position:absolute; top:14px; right:14px; z-index:3;
	width:40px; height:40px; display:none; align-items:center; justify-content:center;
	border-radius:50%; background:#fff; color:#0d1224;
	box-shadow:0 4px 14px rgba(0,0,0,.22);
	transition:transform .25s ease, background .25s ease;
	pointer-events:none;   /* clicks pass straight through to the parent <a> */
}
a.ix-iccar__media .ix-iccar__arrow{ display:flex; }
.ix-iccar__arrow svg{ width:20px; height:20px; }
a.ix-iccar__media:hover .ix-iccar__arrow{ transform:translateY(-2px) scale(1.06); background:#ECE6FF; }
/* Hover overlay RETIRED 2026-08-09. The card copy used to be painted across the photo by a
   pseudo-element that read the media element aria-label or data-desc, and it was revealed only
   on :hover. Text held in an attribute is not content: it does not exist on a touch device and
   it is not reliable indexable copy, so roughly 60 card descriptions were invisible to phones
   and to crawlers alike. The description now renders as a real paragraph (.ix-iccar__desc,
   below), either printed in the page markup or created at load by assets/js/card-desc.js. The
   overlay is switched off here rather than faded out, so nothing can repaint over the image. */
.ix-iccar__media::after{ content:none !important; display:none !important; }
.ix-iccar__name{ text-align:center; font-family:'index happy font',Inter,sans-serif; font-size:20px; font-weight:500; color:#000; margin:28px 0 0; }
.ix-iccar__name a{ color:inherit; text-decoration:none; transition:color .2s ease; }
.ix-iccar__name a:hover{ color:#50269E; }
/* Card description, visible. It used to live only in the data-desc attribute, painted by
   CSS content:attr() on hover. That meant the copy was unreadable on any touch device and
   attribute text is not reliable indexable content, so six paragraphs of real operational
   copy were invisible to both phones and crawlers. Hotel and construction already print it
   as text under the card; this makes that the theme default. */
.ix-iccar__desc{ display:block; text-align:center; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14.5px; line-height:1.6; color:#4a5568; margin:9px auto 0; max-width:34ch; }

/* ===== The Switch (ix-restack): old-stack vs one-system contrast (real-estate + self-storage) ===== */
.ix-restack{ padding:72px 24px; }
.ix-restack__title{ text-align:center; }
.ix-restack__sub{ text-align:center; max-width:640px; margin:0 auto 40px; }
.ix-restack__eyebrow{ display:flex; justify-content:center; margin-bottom:14px; }
.ix-restack__grid{ display:grid; grid-template-columns:1fr 92px 1fr; align-items:stretch; max-width:1080px; margin:0 auto; }
.ix-restack__col{ border-radius:20px; padding:34px 32px; }
.ix-restack__col--old{ background:#f7f7fb; border:1px solid #e7e4f2; color:#0d1224; }
.ix-restack__col--new{ background:linear-gradient(165deg,#5f33ad 0%,#3d1c78 100%); color:#fff; box-shadow:0 18px 44px rgba(61,28,120,.28); }
.ix-restack__h3{ font-family:var(--wp--preset--font-family--heading); font-size:19px; margin:0 0 18px; }
.ix-restack__col--new .ix-restack__h3{ color:#fff; }
.ix-restack__list{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ix-restack__list li{ position:relative; padding:12px 14px 12px 40px; border-radius:12px; font-size:15px; line-height:1.5; }
.ix-restack__col--old li{ background:#fff; border:1px solid #ece9f5; }
.ix-restack__col--old li::before{ content:"\2715"; position:absolute; left:14px; top:12px; color:#b3541e; font-size:13px; font-weight:700; }
.ix-restack__col--new li{ background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); transition:transform .3s ease, background .3s ease; }
.ix-restack__col--new li::before{ content:"\2713"; position:absolute; left:14px; top:12px; color:#9BE7C4; font-size:14px; font-weight:700; }
.ix-restack__col--new li:hover{ transform:translateX(6px); background:rgba(255,255,255,.15); }
.ix-restack__mid{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.ix-restack__node{ width:52px; height:52px; border-radius:50%; background:#50269E; color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 8px 20px rgba(80,38,158,.35); }
.ix-restack__midtext{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#5f5b73; text-align:center; max-width:90px; }
.ix-restack__foot{ text-align:center; margin:34px auto 0; max-width:640px; }
.ix-restack__foot a{ color:#50269E; font-weight:600; }

/* ===== Named integration icons (ix-ico--*): meaning-matched, replaces position-based guessing ===== */

/* ===== ICONS v2 — TWO-TIER TREATMENT (2026-08-04) =====
   Large challenge icons (72px, no container): duotone, 30% brand-tinted body under the stroke.
   Small integration icons (32px): white duotone on a solid brand chip, so every card has an anchor.
   Selectors are deliberately one level MORE specific than the v1 block (.ix-ichal / .ix-iint ancestor added)
   so this wins regardless of which order the two blocks end up in the file. Inline SVG: no extra requests. */
.ix-ichal .ix-ichal__icon.ix-ico--unlinked, .ix-ichal .ix-ichal__icon.ix-ico--unlinked:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Ccircle%20cx%3D%275.8%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3Ccircle%20cx%3D%2718.2%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%275.8%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3Ccircle%20cx%3D%2718.2%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3Cpath%20d%3D%27M9.2%2012h1.7M13.1%2012h1.7%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--bin, .ix-ichal .ix-ichal__icon.ix-ico--bin:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M3.4%207.4h17.2v11.8a1.4%201.4%200%200%201-1.4%201.4H4.8a1.4%201.4%200%200%201-1.4-1.4z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M3.4%207.4h17.2v11.8a1.4%201.4%200%200%201-1.4%201.4H4.8a1.4%201.4%200%200%201-1.4-1.4z%27%2F%3E%3Cpath%20d%3D%27M3.4%207.4%205.6%203.6h12.8l2.2%203.8%27%2F%3E%3Cpath%20d%3D%27M10.4%2012.2a1.7%201.7%200%201%201%201.9%201.7v1.1%27%2F%3E%3Cpath%20d%3D%27M12.3%2017.2h.01%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--bottleneck, .ix-ichal .ix-ichal__icon.ix-ico--bottleneck:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M3.5%204.6h17l-6.6%207.7v6.1l-3.8%201.9v-8z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M3.5%204.6h17l-6.6%207.7v6.1l-3.8%201.9v-8z%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--blind, .ix-ichal .ix-ichal__icon.ix-ico--blind:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M2.6%2012S6.2%206%2012%206s9.4%206%209.4%206-3.6%206-9.4%206-9.4-6-9.4-6z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M2.6%2012S6.2%206%2012%206s9.4%206%209.4%206-3.6%206-9.4%206-9.4-6-9.4-6z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%272.5%27%2F%3E%3Cpath%20d%3D%27M4.2%2019.8%2019.8%204.2%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--warehouse, .ix-ichal .ix-ichal__icon.ix-ico--warehouse:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M3%2020V9.6L12%204l9%205.6V20z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M3%2020V9.6L12%204l9%205.6V20%27%2F%3E%3Cpath%20d%3D%27M2.6%2020h18.8%27%2F%3E%3Cpath%20d%3D%27M8%2020v-6.5h8V20%27%2F%3E%3Cpath%20d%3D%27M8%2016.6h8%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--plan, .ix-ichal .ix-ichal__icon.ix-ico--plan:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3C%2Fg%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M6.4%208.4h7M6.4%2012h4.4M6.4%2015.6h5.6%27%2F%3E%3Cpath%20d%3D%27M15.6%2012.6a1.7%201.7%200%201%201%201.9%201.7v1%27%2F%3E%3Cpath%20d%3D%27M17.5%2017.4h.01%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--cad, .ix-ichal .ix-ichal__icon.ix-ico--cad:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Crect%20x%3D%273%27%20y%3D%273.5%27%20width%3D%2718%27%20height%3D%2717%27%20rx%3D%272%27%2F%3E%3C%2Fg%3E%3Crect%20x%3D%273%27%20y%3D%273.5%27%20width%3D%2718%27%20height%3D%2717%27%20rx%3D%272%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%273.4%27%2F%3E%3Cpath%20d%3D%27M12%205.8v2.2M12%2016v2.2M5.6%2012h2.2M16.2%2012h2.2%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--barcode, .ix-ichal .ix-ichal__icon.ix-ico--barcode:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3C%2Fg%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M6.6%208.6v6.8M9.2%208.6v6.8M11.8%208.6v6.8M15%208.6v6.8M17.6%208.6v6.8%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--accounts, .ix-ichal .ix-ichal__icon.ix-ico--accounts:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Crect%20x%3D%274.2%27%20y%3D%273%27%20width%3D%2715.6%27%20height%3D%2718%27%20rx%3D%272%27%2F%3E%3C%2Fg%3E%3Crect%20x%3D%274.2%27%20y%3D%273%27%20width%3D%2715.6%27%20height%3D%2718%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M8%208.6h8M8%2012.2h8%27%2F%3E%3Cpath%20d%3D%27M8%2016.6h8%27%20stroke-width%3D%273%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--edi, .ix-ichal .ix-ichal__icon.ix-ico--edi:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Crect%20x%3D%272.6%27%20y%3D%273.4%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%2713.8%27%20y%3D%2711%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3C%2Fg%3E%3Crect%20x%3D%272.6%27%20y%3D%273.4%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%2713.8%27%20y%3D%2711%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M12.2%206.6h5M15.2%204.9l1.9%201.7-1.9%201.7%27%2F%3E%3Cpath%20d%3D%27M11.8%2017.4h-5M8.8%2015.7l-1.9%201.7%201.9%201.7%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--shipping, .ix-ichal .ix-ichal__icon.ix-ico--shipping:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M2.8%206.6h10.4v9H2.8z%27%2F%3E%3Cpath%20d%3D%27M13.2%209.6h3.6l3%203v3h-6.6z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M2.8%206.6h10.4v9H2.8z%27%2F%3E%3Cpath%20d%3D%27M13.2%209.6h3.6l3%203v3h-6.6z%27%2F%3E%3Ccircle%20cx%3D%277%27%20cy%3D%2718%27%20r%3D%271.9%27%2F%3E%3Ccircle%20cx%3D%2716.6%27%20cy%3D%2718%27%20r%3D%271.9%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal .ix-ichal__icon.ix-ico--quality, .ix-ichal .ix-ichal__icon.ix-ico--quality:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20fill%3D%27%2350269E%27%20fill-opacity%3D%270.30%27%20stroke%3D%27none%27%3E%3Cpath%20d%3D%27M12%203l7.2%203v5.4c0%204.2-3%207.7-7.2%208.6-4.2-.9-7.2-4.4-7.2-8.6V6z%27%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%27M12%203l7.2%203v5.4c0%204.2-3%207.7-7.2%208.6-4.2-.9-7.2-4.4-7.2-8.6V6L12%203z%27%2F%3E%3Cpath%20d%3D%27M8.9%2011.9l2.3%202.3%204.1-4.5%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
/* chip container — !important because .ix-iint__icon is still declared in per-page injected <style> blocks (de-scoping still owed) */
.ix-iint .ix-iint__icon{ background-color:#f0ebff !important; border-radius:14px !important; width:52px !important; height:52px !important; background-size:24px 24px !important; box-shadow:none !important; transition:background-color .3s ease, transform .35s cubic-bezier(.22,.9,.3,1), box-shadow .3s ease !important; }
.ix-iint .ix-iint__card:hover .ix-iint__icon{ background-color:#ece2ff !important; transform:translateY(-3px) scale(1.06) !important; }
/* ===== Manufacturing named icons (ix-ico--*) added 2026-08-03 — meaning-matched, apply to BOTH ix-ichal and ix-iint ===== */
.ix-ichal__icon.ix-ico--unlinked, .ix-ichal__icon.ix-ico--unlinked:empty, .ix-iint__icon.ix-ico--unlinked, .ix-iint__icon.ix-ico--unlinked:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%275.8%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3Ccircle%20cx%3D%2718.2%27%20cy%3D%2712%27%20r%3D%272.9%27%2F%3E%3Cpath%20d%3D%27M9.2%2012h1.7M13.1%2012h1.7%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--bin, .ix-ichal__icon.ix-ico--bin:empty, .ix-iint__icon.ix-ico--bin, .ix-iint__icon.ix-ico--bin:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3.4%207.4h17.2v11.8a1.4%201.4%200%200%201-1.4%201.4H4.8a1.4%201.4%200%200%201-1.4-1.4z%27%2F%3E%3Cpath%20d%3D%27M3.4%207.4%205.6%203.6h12.8l2.2%203.8%27%2F%3E%3Cpath%20d%3D%27M10.4%2012.2a1.7%201.7%200%201%201%201.9%201.7v1.1%27%2F%3E%3Cpath%20d%3D%27M12.3%2017.2h.01%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--bottleneck, .ix-ichal__icon.ix-ico--bottleneck:empty, .ix-iint__icon.ix-ico--bottleneck, .ix-iint__icon.ix-ico--bottleneck:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3.5%204.6h17l-6.6%207.7v6.1l-3.8%201.9v-8z%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--blind, .ix-ichal__icon.ix-ico--blind:empty, .ix-iint__icon.ix-ico--blind, .ix-iint__icon.ix-ico--blind:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M2.6%2012S6.2%206%2012%206s9.4%206%209.4%206-3.6%206-9.4%206-9.4-6-9.4-6z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%272.5%27%2F%3E%3Cpath%20d%3D%27M4.2%2019.8%2019.8%204.2%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--warehouse, .ix-ichal__icon.ix-ico--warehouse:empty, .ix-iint__icon.ix-ico--warehouse, .ix-iint__icon.ix-ico--warehouse:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2020V9.6L12%204l9%205.6V20%27%2F%3E%3Cpath%20d%3D%27M2.6%2020h18.8%27%2F%3E%3Cpath%20d%3D%27M8%2020v-6.5h8V20%27%2F%3E%3Cpath%20d%3D%27M8%2016.6h8%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--plan, .ix-ichal__icon.ix-ico--plan:empty, .ix-iint__icon.ix-ico--plan, .ix-iint__icon.ix-ico--plan:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M6.4%208.4h7M6.4%2012h4.4M6.4%2015.6h5.6%27%2F%3E%3Cpath%20d%3D%27M15.6%2012.6a1.7%201.7%200%201%201%201.9%201.7v1%27%2F%3E%3Cpath%20d%3D%27M17.5%2017.4h.01%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--cad, .ix-ichal__icon.ix-ico--cad:empty, .ix-iint__icon.ix-ico--cad, .ix-iint__icon.ix-ico--cad:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%273.5%27%20width%3D%2718%27%20height%3D%2717%27%20rx%3D%272%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%273.4%27%2F%3E%3Cpath%20d%3D%27M12%205.8v2.2M12%2016v2.2M5.6%2012h2.2M16.2%2012h2.2%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--barcode, .ix-ichal__icon.ix-ico--barcode:empty, .ix-iint__icon.ix-ico--barcode, .ix-iint__icon.ix-ico--barcode:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M6.6%208.6v6.8M9.2%208.6v6.8M11.8%208.6v6.8M15%208.6v6.8M17.6%208.6v6.8%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--accounts, .ix-ichal__icon.ix-ico--accounts:empty, .ix-iint__icon.ix-ico--accounts, .ix-iint__icon.ix-ico--accounts:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274.2%27%20y%3D%273%27%20width%3D%2715.6%27%20height%3D%2718%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M8%208.6h8M8%2012.2h8%27%2F%3E%3Cpath%20d%3D%27M8%2016.6h8%27%20stroke-width%3D%273%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--edi, .ix-ichal__icon.ix-ico--edi:empty, .ix-iint__icon.ix-ico--edi, .ix-iint__icon.ix-ico--edi:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%272.6%27%20y%3D%273.4%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%2713.8%27%20y%3D%2711%27%20width%3D%277.6%27%20height%3D%279.6%27%20rx%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M12.2%206.6h5M15.2%204.9l1.9%201.7-1.9%201.7%27%2F%3E%3Cpath%20d%3D%27M11.8%2017.4h-5M8.8%2015.7l-1.9%201.7%201.9%201.7%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--shipping, .ix-ichal__icon.ix-ico--shipping:empty, .ix-iint__icon.ix-ico--shipping, .ix-iint__icon.ix-ico--shipping:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M2.8%206.6h10.4v9H2.8z%27%2F%3E%3Cpath%20d%3D%27M13.2%209.6h3.6l3%203v3h-6.6z%27%2F%3E%3Ccircle%20cx%3D%277%27%20cy%3D%2718%27%20r%3D%271.9%27%2F%3E%3Ccircle%20cx%3D%2716.6%27%20cy%3D%2718%27%20r%3D%271.9%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico--quality, .ix-ichal__icon.ix-ico--quality:empty, .ix-iint__icon.ix-ico--quality, .ix-iint__icon.ix-ico--quality:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203l7.2%203v5.4c0%204.2-3%207.7-7.2%208.6-4.2-.9-7.2-4.4-7.2-8.6V6L12%203z%27%2F%3E%3Cpath%20d%3D%27M8.9%2011.9l2.3%202.3%204.1-4.5%27%2F%3E%3C%2Fsvg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; }
.ix-ichal__icon.ix-ico{ background-repeat:no-repeat; background-position:center; background-size:26px 26px; }
.ix-ichal__icon.ix-ico--blueprint, .ix-ichal__icon.ix-ico--blueprint:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%205h18v14H3z%27%2F%3E%3Cpath%20d%3D%27M3%209h18M8%209v10M13%2013h5M13%2016h3%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--platform, .ix-ichal__icon.ix-ico--platform:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%203%203%207.5%2012%2012l9-4.5L12%203z%27%2F%3E%3Cpath%20d%3D%27M3%2012l9%204.5L21%2012%27%2F%3E%3Cpath%20d%3D%27M3%2016.5%2012%2021l9-4.5%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--ledger, .ix-ichal__icon.ix-ico--ledger:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%203h11l4%204v14H5z%27%2F%3E%3Cpath%20d%3D%27M16%203v4h4%27%2F%3E%3Cpath%20d%3D%27M9%2012h7M9%2016h5%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--payroll, .ix-ichal__icon.ix-ico--payroll:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278%27%2F%3E%3Cpath%20d%3D%27M12%208v4l2.5%202%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--plant, .ix-ichal__icon.ix-ico--plant:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2018h14M6%2018v-4h5l3-4h3l2%204v4%27%2F%3E%3Ccircle%20cx%3D%277.5%27%20cy%3D%2719.5%27%20r%3D%271.6%27%2F%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2719.5%27%20r%3D%271.6%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--swap, .ix-ichal__icon.ix-ico--swap:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%208h13l-3-3M20%2016H7l3%203%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--feed, .ix-ichal__icon.ix-ico--feed:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2020h4M4%2020a12%2012%200%200%201%2012-12M4%2020a7%207%200%200%201%207-7%27%2F%3E%3Ccircle%20cx%3D%2718.5%27%20cy%3D%275.5%27%20r%3D%271.6%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--code, .ix-ichal__icon.ix-ico--code:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%208%205%2012l4%204M15%208l4%204-4%204%27%2F%3E%3C%2Fsvg%3E") !important; }
.ix-ichal__icon.ix-ico--vault, .ix-ichal__icon.ix-ico--vault:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%274%27%2F%3E%3Cpath%20d%3D%27M12%208v1.5M12%2014.5V16M8%2012h1.5M14.5%2012H16%27%2F%3E%3C%2Fsvg%3E") !important; }

/* ===== Integration sections v2: soft platform cards (spine and dot removed after design review) ===== */
.ix-iintg .ix-ichal__card, .ix-iconnect .ix-ichal__card, .ix-iint .ix-ichal__card, .ix-iint__card{ background:linear-gradient(180deg,#fbfaff 0%,#f4f0fc 100%); border:1px solid #e7e0f7; border-radius:18px; position:relative; overflow:hidden; transition:transform .3s ease, box-shadow .3s ease; }
.ix-iintg .ix-ichal__card::before, .ix-iconnect .ix-ichal__card::before, .ix-iint .ix-ichal__card::before, .ix-iint__card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,#50269E,#a78bfa,#e9dfff); }
.ix-iintg .ix-ichal__icon, .ix-iconnect .ix-ichal__icon, .ix-iint .ix-ichal__icon{ width:64px; height:64px; padding:14px; background:#efe9fb; border-radius:50%; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; transition:background .3s ease, color .3s ease; }
.ix-iintg .ix-ichal__icon svg, .ix-iconnect .ix-ichal__icon svg, .ix-iint .ix-ichal__icon svg{ width:100%; height:100%; }
.ix-iintg .ix-ichal__card:hover, .ix-iconnect .ix-ichal__card:hover, .ix-iint .ix-ichal__card:hover, .ix-iint__card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(80,38,158,.14); }
.ix-iintg .ix-ichal__card:hover .ix-ichal__icon, .ix-iconnect .ix-ichal__card:hover .ix-ichal__icon, .ix-iint .ix-ichal__card:hover .ix-ichal__icon{ background:#50269E; color:#fff; }

/* ===== Proof band (ix-proofband): the page flexes real delivery ===== */
.ix-proofband{ margin:8px auto 0; }
.ix-proofband__in{ background:linear-gradient(150deg,#3d1c78 0%,#50269E 55%,#5f33ad 100%); border-radius:26px; padding:34px 40px 30px; color:#fff; text-align:center; box-shadow:0 24px 60px rgba(61,28,120,.28); position:relative; overflow:hidden; }
.ix-proofband__in::before{ content:""; position:absolute; top:-70px; right:-70px; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 68%); }
.ix-proofband__eyebrow{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#cdbcf2; margin:0 0 26px; font-weight:600; }
.ix-proofband__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:880px; margin:0 auto 18px; }
.ix-proofband__stat b{ display:block; font-family:var(--wp--preset--font-family--heading); font-size:clamp(30px,3.4vw,44px); line-height:1.05; font-weight:700; }
.ix-proofband__stat span{ display:block; margin-top:10px; font-size:14px; color:#e4dbf8; line-height:1.45; }
.ix-proofband__line{ max-width:640px; margin:0 auto; font-size:15.5px; line-height:1.5; color:#efe9fb; }
.ix-proofband__line a{ color:#fff; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:720px){ .ix-proofband__in{ padding:38px 22px 34px; } .ix-proofband__grid{ grid-template-columns:1fr; gap:18px; } }

/* Carousel attract mode RETIRED 2026-08-09 together with the hover overlay it drove: the
   ixattract keyframe flashed the ::after panel open on a 24 second loop, and the keyframe
   went with it (nothing else referenced it). The copy is a visible paragraph now. */
@media (max-width:860px){ .ix-restack__grid{ grid-template-columns:1fr; gap:16px; } .ix-restack__mid{ flex-direction:row; } .ix-restack__node{ transform:rotate(90deg); } }

/* ===== Real-estate lifecycle carousel (ix-re-life): numbered stages + purple glass hover + gentle zoom ===== */
.ix-iccar__img{ transition:transform .55s cubic-bezier(.22,.61,.36,1); }
/* Scoped 2026-08-25: on a GENERIC card an inert <div> was zooming its photo on hover,
   promising a click that never happened, so there the zoom follows the markup like the
   arrow badge and the cursor do. But .ix-re-life is a different case: the story carousel
   declares "numbered stages + purple glass hover + gentle zoom" as its own look (see the
   section heading above and story-carousels-and-switch-sections in project_memory), and
   its cards are deliberately inert now. The zoom there is house style, not a click cue,
   so it is restored explicitly rather than lost as a side effect of the scoping. */
a.ix-iccar__media:hover .ix-iccar__img,
.ix-re-life .ix-iccar__media:hover .ix-iccar__img{ transform:scale(1.05); }
.ix-iccar__track{ counter-reset:relife; }
.ix-iccar__card{ counter-increment:relife; }
.ix-iccar__media::before{ content:counter(relife,decimal-leading-zero); position:absolute; top:14px; left:14px; z-index:2; width:44px; height:32px; display:flex; align-items:center; justify-content:center; background:rgba(13,18,36,.55); color:#fff; font-family:'index happy font',Inter,sans-serif; font-size:15px; font-weight:600; letter-spacing:.06em; border-radius:10px; backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.22); }
.ix-re-life .ix-iccar__media:hover::before{ background:rgba(255,255,255,.18); }
.ix-re-life .ix-iccar__name{ font-size:19px; }
.ix-iccar__nav{ max-width:990px; margin:40px auto 0; display:flex; align-items:center; justify-content:space-between; position:relative; }
.ix-iccar__abtn{ width:56px; height:56px; border-radius:50%; background:#ECE6FF; color:#060038; border:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:background .2s ease, opacity .2s ease; }
.ix-iccar__abtn:hover{ background:#ddd2ff; }
.ix-iccar__abtn:disabled{ opacity:.4; cursor:default; }
.ix-iccar__dots{ position:absolute; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:16px; }
.ix-iccar__dot{ width:10px; height:10px; border-radius:50%; background:#D6D1E8; border:0; padding:0; cursor:pointer; transition:width .3s ease, background .3s ease; }
.ix-iccar__dot.is-active{ width:26px; border-radius:5px; background:#060038; }
@media (max-width:1100px){ .ix-iccar__title{ font-size:2rem; } }
@media (max-width:640px){
	/* full-bleed carousel (no section side padding) so the active card centers in the
	   viewport; header/nav keep their own inset. Centered active card + peek both sides. */
	.ix-iccar{ padding:44px 0 52px; }
	.ix-iccar__head{ padding-left:16px; padding-right:16px; }
	.ix-iccar__card{ flex-basis:80vw; max-width:none; }
	.ix-iccar__track{ padding-left:10vw; padding-right:10vw; }
	.ix-iccar__abtn{ display:none; }   /* no arrows on phone — swipe + dots */
	.ix-iccar__nav{ margin-top:24px; padding-left:16px; padding-right:16px; }
}

/* Odoo Services carousel — icon + title + text cards (reuses .ix-iccar carousel + image-card-carousel.js) */
.ix-oscar .ix-iccar__card{ flex:0 0 320px; max-width:320px; }
.ix-oscar__inner{ height:100%; display:flex; flex-direction:column; background:#fff; border:1px solid var(--border); border-radius:20px; padding:30px 26px 26px; transition:box-shadow .2s ease, transform .2s ease; }
.ix-oscar__inner:hover{ box-shadow:0 18px 44px rgba(13,18,36,.10); transform:translateY(-4px); }
.ix-oscar__icon{ width:58px; height:58px; min-width:58px; border-radius:15px; background:#ECE6FF; color:#50269E; display:flex; align-items:center; justify-content:center; margin-bottom:22px; }
.ix-oscar__icon svg{ width:28px; height:28px; }
.ix-oscar__name{ font-family:'index happy font',Inter,sans-serif; font-size:20px; font-weight:600; color:var(--text-dark); margin:0 0 10px; }
.ix-oscar__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; line-height:1.6; color:var(--text-mid); margin:0 0 22px; flex:1; }
.ix-oscar__link{ display:inline-flex; align-items:center; gap:7px; color:#50269E; text-decoration:none; font-weight:600; font-size:15px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-oscar__link svg{ width:15px; height:15px; transition:transform .2s ease; }
.ix-oscar__link:hover svg{ transform:translate(3px,-3px); }
@media (max-width:640px){ .ix-oscar .ix-iccar__card{ flex-basis:80vw; max-width:none; } }

/* =========================================================================
   Case Studies Archive  (.ix-csa)  — full listing page: heading + filters + grid
   ========================================================================= */
.ix-csa{ padding:64px 24px 104px; background:#fff; }
.ix-csa__inner{ max-width:1300px; margin:0 auto; }

/* Header */
.ix-csa__head{ text-align:center; max-width:760px; margin:0 auto 40px; }
.ix-csa__head .badge-wrapper{ justify-content:center; margin:0 auto 18px; }
.ix-csa__title{
	font-family:"index happy font", Inter, sans-serif;
	font-size:clamp(2.125rem, 4vw, 3.125rem);
	line-height:1.1; font-weight:400; color:#0d1224; margin:0;
}
.ix-csa__sub{
	font-family:"AlmadenSans para", Inter, sans-serif;
	font-size:1.0625rem; line-height:1.6; color:#4a5568;
	margin:16px auto 0; max-width:560px;
}

/* Filter bar */
/* Toolbar: text search + Industries dropdown */
.ix-csa__toolbar{ display:flex; flex-wrap:wrap; align-items:stretch; gap:14px; margin:0 0 40px; }
.ix-csa__search{ position:relative; flex:1 1 420px; min-width:240px; display:flex; align-items:center; }
.ix-csa__search-ico{ position:absolute; left:18px; color:#0d1224; pointer-events:none; }
.ix-csa__search-input{ width:100%; height:54px; border:1px solid #e6e8ee; background:#f6f6f8; border-radius:12px; padding:0 44px 0 50px; font:400 16px/1 "AlmadenSans para", Inter, sans-serif; color:#0d1224; outline:none; transition:border-color .18s, background .18s; }
.ix-csa__search-input::placeholder{ color:#8b909c; }
.ix-csa__search-input:focus{ border-color:#0d1224; background:#fff; }
.ix-csa__search-input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }
.ix-csa__search-clear{ position:absolute; right:14px; width:26px; height:26px; border:0; background:none; color:#8b909c; font-size:22px; line-height:1; cursor:pointer; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.ix-csa__search-clear:hover{ color:#0d1224; }

.ix-csa__dd{ position:relative; flex:0 0 auto; }
.ix-csa__dd-btn{ display:inline-flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-width:210px; height:54px; background:#fff; border:1px solid #d9dce3; border-radius:12px; padding:0 18px; cursor:pointer; font:500 16px/1 "AlmadenSans para", Inter, sans-serif; color:#0d1224; transition:border-color .18s; }
.ix-csa__dd-btn:hover{ border-color:#b9bdc8; }
.ix-csa__dd[data-open="true"] .ix-csa__dd-btn{ border-color:#0d1224; }
.ix-csa__dd-caret{ flex:0 0 auto; transition:transform .2s ease; }
.ix-csa__dd[data-open="true"] .ix-csa__dd-caret{ transform:rotate(180deg); }
.ix-csa__dd-panel{ position:absolute; z-index:30; top:calc(100% + 8px); left:0; min-width:266px; max-height:330px; overflow-y:auto; background:#fff; border:1px solid #e2e5ec; border-radius:12px; box-shadow:0 18px 44px rgba(13,18,36,.14); padding:8px; }
.ix-csa__dd-hint{ font:400 12px/1.3 "AlmadenSans para", Inter, sans-serif; color:#8b909c; margin:6px 10px 8px; }
.ix-csa__dd-list{ list-style:none; margin:0; padding:0; }
.ix-csa__dd-list li{ margin:0; }
.ix-csa__dd-opt{ display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:8px; cursor:pointer; font:500 15px/1.2 "AlmadenSans para", Inter, sans-serif; color:#1f2430; }
.ix-csa__dd-opt:hover{ background:#f4f2fb; }
.ix-csa__dd-opt input{ width:18px; height:18px; accent-color:#50269E; cursor:pointer; flex:0 0 auto; }
/* Toolbar responsive. Two faults were leaving large dead space on phones:
   1. At <=600 the toolbar becomes flex-direction:column, but .ix-csa__search kept
      `flex:1 1 420px`. In a COLUMN flex container flex-basis sizes the MAIN axis,
      which is now the height, so the search wrapper resolved to a 420px tall box
      around a 54px input. Reset to flex:0 0 auto so it hugs the input.
   2. Between 601 and 860 the row still wraps (420 + 210 + 14 gap = 644px needed).
      The dropdown is flex:0 0 auto, so once wrapped it sat at its 210px min-width
      with the rest of the row empty. Let both grow to fill whatever row they land on. */
@media (max-width:860px){
	.ix-csa__search{ flex:1 1 260px; }
	.ix-csa__dd{ flex:1 1 210px; }
}
@media (max-width:600px){
	.ix-csa__toolbar{ flex-direction:column; gap:10px; margin-bottom:28px; }
	.ix-csa__search{ flex:0 0 auto; width:100%; min-width:0; }
	.ix-csa__dd{ flex:0 0 auto; width:100%; }
	.ix-csa__dd-panel{ width:100%; min-width:0; }
	.ix-csa__dd-btn{ min-width:0; }
	.ix-csa__search-input{ height:48px; padding:0 40px 0 46px; font-size:15px; }
	.ix-csa__dd-btn{ height:48px; }
}

/* Grid */
.ix-csa__grid{ display:grid; grid-template-columns:repeat(3, 1fr); column-gap:28px; row-gap:48px; }
.ix-csa__card{ display:flex; flex-direction:column; }
.ix-csa__card[hidden]{ display:none; }

.ix-csa__media{
	position:relative; display:block; overflow:hidden;
	aspect-ratio:433 / 400; border-radius:16px; background:#f0ebff;
}
.ix-csa__media img{
	width:100%; height:100%; object-fit:cover; display:block;
	transition:transform .5s cubic-bezier(.2,.6,.2,1);
}
.ix-csa__card:hover .ix-csa__media img{ transform:scale(1.05); }

/* Hover arrow badge */
.ix-csa__arrow{
	position:absolute; top:16px; right:16px;
	width:44px; height:44px; border-radius:50%;
	display:grid; place-items:center;
	background:#fff; color:#060038;
	opacity:0; transform:translateY(-6px) scale(.9);
	transition:opacity .25s ease, transform .25s ease;
	box-shadow:0 6px 18px rgba(13,18,36,.18);
}
.ix-csa__card:hover .ix-csa__arrow{ opacity:1; transform:translateY(0) scale(1); }

/* Card text */
.ix-csa__card-title{ margin:22px 0 0; font-size:1.375rem; line-height:1.25; font-weight:600; }
.ix-csa__card-title a{
	font-family:"index happy font", Inter, sans-serif;
	color:#16182b; text-decoration:none; transition:color .18s ease;
}
.ix-csa__card:hover .ix-csa__card-title a{ color:#50269E; }

.ix-csa__tag{
	align-self:flex-start; margin-top:14px;
	font:500 14px/1 Inter, sans-serif; color:#50269E;
	background:#ECE6FF; border-radius:999px; padding:7px 16px;
}

.ix-csa__empty{ text-align:center; color:#696b6e; font-size:1rem; padding:48px 0; }

/* Responsive */
@media (max-width:1024px){
	.ix-csa__grid{ grid-template-columns:repeat(2, 1fr); column-gap:24px; row-gap:40px; }
}
@media (max-width:640px){
	.ix-csa{ padding:48px 18px 72px; }
	.ix-csa__grid{ grid-template-columns:1fr; row-gap:36px; }
	.ix-csa__card-title{ font-size:1.25rem; }
}

/* ===== Contact page (pixel-matched to staging) ===== */
/* Breadcrumb — visible trail mirroring the Yoast BreadcrumbList schema */
.ix-breadcrumb{ max-width:1360px; margin:0 auto; padding:22px 24px 0; }
.ix-breadcrumb__inner{ list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:0; margin:0; padding:0; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; line-height:1.4; }
.ix-breadcrumb__item{ display:inline-flex; align-items:center; color:#5b6070; }
.ix-breadcrumb__item + .ix-breadcrumb__item::before{ content:"\203A"; margin:0 10px; color:#b9b0d0; }
.ix-breadcrumb__item a{ color:#50269E; text-decoration:none; }
.ix-breadcrumb__item a:hover{ text-decoration:underline; }
.ix-breadcrumb__item [aria-current="page"]{ color:#0b0b0b; }
.ix-contact{ background:linear-gradient(to right,#fff 60%,#2B1458 60%); padding:64px 24px 96px; }
.ix-contact__inner{ max-width:1360px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) 665px; gap:48px; align-items:start; }
.ix-contact__left,.ix-contact__right{ min-width:0; }
.ix-contact__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; font-weight:600; line-height:1.15; color:#0b0b0b; margin:0 0 12px; }
.ix-contact__sub{ font-size:19px; color:#3a3a3a; margin:0 0 34px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-contact__items{ display:flex; flex-direction:column; gap:22px; margin-bottom:32px; }
.ix-citem{ display:flex; gap:14px; align-items:flex-start; }
.ix-citem__ic{ flex:0 0 auto; color:#50269E; margin-top:2px; }
.ix-citem__body strong{ display:block; font-size:18px; font-weight:700; color:#0b0b0b; margin-bottom:4px; font-family:Inter,sans-serif; }
.ix-citem__body p{ margin:0; font-size:16px; line-height:1.6; color:#3a3a3a; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-citem__body a{ color:#50269E; text-decoration:none; }
.ix-citem__body a:hover{ text-decoration:underline; }
.ix-cmarquee__label{ font:700 11px/1 'AlmadenSans para',Inter,sans-serif; letter-spacing:1.4px; text-transform:uppercase; color:#8a8798; margin:0 0 14px; }
.ix-cmarquee{ overflow:hidden; margin:0 0 26px; -webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent); }
.ix-cmarquee__track{ display:flex; align-items:center; gap:48px; width:max-content; animation:ix-cmarq 26s linear infinite; }
.ix-cmarquee:hover .ix-cmarquee__track{ animation-play-state:paused; }
.ix-cmarquee__logo img{ height:32px; width:auto; object-fit:contain; filter:grayscale(1); opacity:.8; }
@keyframes ix-cmarq{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
.ix-ccall{ font-size:18px; color:#0b0b0b; margin:0; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-ccall a{ color:#50269E; text-decoration:none; }
.ix-ccall a:hover{ text-decoration:underline; }
.ix-ccta{ margin:10px 0 0; font-size:15.5px; color:#4a5568; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-ccta a{ color:#50269E; font-weight:600; text-decoration:none; }
.ix-ccta a::after{ content:"\00A0\2192"; }
.ix-ccta a:hover{ text-decoration:underline; }

.ix-contact__right{ display:flex; justify-content:flex-end; }
.ix-cform{ background:#fff; border:4px solid #00FF8E; border-radius:20px; padding:24px; width:100%; max-width:665px; box-shadow:0 0 40px rgba(0,255,142,.15); }
.ix-cform__title{ font-family:'index happy font',Inter,sans-serif; font-size:24px; font-weight:700; color:#0b0b0b; margin:0 0 22px; }
.ix-cform__grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.ix-cform input,.ix-cform select,.ix-cform textarea{ width:100%; background:#fff; border:1px solid rgba(0,0,0,.5); border-radius:10px; padding:8px 16px; font-size:18px; font-family:'AlmadenSans para',Inter,sans-serif; color:#111; box-sizing:border-box; }
.ix-cform input::placeholder,.ix-cform textarea::placeholder{ color:rgba(0,0,0,.5); }
.ix-cform__select{ margin-bottom:16px; color:rgba(0,0,0,.55); appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23333' stroke-width='2'%3E%3Cpath d='M2 4l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; }
.ix-cform__msg{ margin-bottom:18px; resize:vertical; min-height:110px; }
.ix-cform input:focus,.ix-cform select:focus,.ix-cform textarea:focus{ outline:none; border-color:#50269E; }
.ix-cform__actions{ display:flex; justify-content:flex-end; }
/* IWWR-196: Turnstile slot. interaction-only mode keeps it empty for most visitors; when
   Cloudflare does need a click it appears right-aligned above the Send button. */
.ix-cform__ts{ display:flex; justify-content:flex-end; }
.ix-cform__ts iframe{ margin:0 0 14px; }
.ix-cform__actions .ix-btn{ font-size:16px; padding:13px 22px; border-radius:12px; min-height:47px; }
/* Contact form: honeypot (visually hidden, off-screen) + submit status banner */
.ix-cform__hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.ix-cform__note{ margin:0 0 18px; padding:12px 16px; border-radius:10px; font-size:15px; line-height:1.45; }
.ix-cform__note--ok{ background:#e7f9f0; border:1px solid #00c07f; color:#046c48; }
.ix-cform__note--err{ background:#fdecec; border:1px solid #e5484d; color:#a11419; }
.ix-cform__note a{ color:inherit; text-decoration:underline; }

/* Contact form: per-service help panel.
   Appended to assets/css/components.css directly after the .ix-cform__note rules
   (currently line 1702), so it stays with the rest of the contact-form block.
   Colours are theme.json tokens only: purple-bg #f0ebff, primary #50269E,
   text-dark #0d1224, text-mid #4a5568, text-light #696b6e. No new colour. */

/* The unchosen "What can we help with?*" line was rendering in full black because
   ".ix-cform select" outranks ".ix-cform__select". Match the input placeholders:
   grey until a real value is chosen. Uses :invalid, which required + value="" gives us. */
.ix-cform select:invalid{ color:rgba(0,0,0,.5); }

.ix-cform__help{
	background:#f0ebff;
	border-left:3px solid #50269E;
	border-radius:0 10px 10px 0;
	padding:14px 18px 15px;
	margin:0 0 16px;
	font-family:'AlmadenSans para',Inter,sans-serif;
}
.ix-cform__help:empty{ display:none; }   /* ships empty; the script fills it */

.ix-cform__help-lead{
	margin:0 0 8px;
	font-size:13px;
	font-weight:700;
	letter-spacing:.05em;
	text-transform:uppercase;
	color:#50269E;
}
.ix-cform__help-list{
	margin:0;
	padding:0 0 0 18px;
	list-style:disc;
}
.ix-cform__help-list li{
	font-size:15.5px;
	line-height:1.5;
	color:#4a5568;
	margin:0 0 4px;
}
.ix-cform__help-list li:last-child{ margin-bottom:0; }

.ix-cform__help-eg{
	margin:11px 0 0;
	padding:9px 12px;
	background:#fff;
	border-radius:8px;
	font-size:14.5px;
	line-height:1.5;
	color:#696b6e;
}
.ix-cform__help-eg span{
	display:block;
	font-size:11.5px;
	font-weight:700;
	letter-spacing:.07em;
	text-transform:uppercase;
	color:#0d1224;
	margin:0 0 3px;
}
.ix-cform__help-eg em{ font-style:italic; }

/* The panel appears between the select and the message box, so the message box
   moves down. Softened, and skipped entirely for anyone who asks for less motion. */
@media (prefers-reduced-motion:no-preference){
	.ix-cform__help{ animation:ix-help-in .18s ease-out; }
	@keyframes ix-help-in{
		from{ opacity:0; transform:translateY(-4px); }
		to  { opacity:1; transform:none; }
	}
}

@media (max-width:560px){
	.ix-cform__help{ padding:12px 14px 13px; }
	.ix-cform__help-list li{ font-size:15px; }
	.ix-cform__help-eg{ font-size:14px; }
}

.ix-locbanner{ background:#50269E; }
.ix-locbanner__inner{ max-width:1360px; margin:0 auto; padding:26px 24px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.ix-locbanner__text{ margin:0; color:#fff; font-size:24px; font-weight:500; line-height:1.3; max-width:520px; font-family:'index happy font',Inter,sans-serif; }
.ix-locbanner__flags{ display:flex; align-items:center; gap:16px; flex:0 0 auto; }
.ix-locbanner__flag{ width:48px; height:48px; border-radius:50%; overflow:hidden; display:block; box-shadow:0 0 0 3px rgba(255,255,255,.9); }
.ix-locbanner__flag svg{ width:100%; height:100%; display:block; }
.ix-locations{ background:#fff; padding:64px 24px 90px; }
.ix-locations__inner{ max-width:1280px; margin:0 auto; }
.ix-locations__title{ font-family:'index happy font',Inter,sans-serif; font-size:32px; font-weight:600; color:#0b0b0b; text-align:center; margin:0 0 14px; }
.ix-locations__rule{ width:90px; height:3px; background:#50269E; border-radius:3px; margin:0 auto 48px; }
.ix-locations__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.ix-loc{ border:1px solid #ECE6FF; border-radius:20px; overflow:hidden; background:#fff; display:flex; flex-direction:column; }
.ix-loc__photo{ width:100%; aspect-ratio:16/10; overflow:hidden; }
.ix-loc__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.ix-loc__role{ align-self:center; margin-top:20px; padding:5px 12px; border-radius:999px; font:700 10.5px/1 'AlmadenSans para',Inter,sans-serif; letter-spacing:.5px; text-transform:uppercase; background:#ECE6FF; color:#50269E; }
.ix-loc__role--hq{ background:#FBEFD6; color:#8a5a00; }
.ix-loc__role + .ix-loc__name{ margin-top:10px; }
.ix-loc__name{ font-family:'index happy font',Inter,sans-serif; font-size:20px; font-weight:600; color:#0b0b0b; text-align:center; margin:22px 0 10px; }
.ix-loc__desc{ font-size:14.5px; line-height:1.55; color:#3a3a3a; text-align:center; margin:0 0 16px; padding:0 26px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-loc__list{ list-style:none; margin:0; padding:0 26px 26px; display:flex; flex-direction:column; gap:12px; }
.ix-loc__list li{ display:flex; gap:12px; align-items:flex-start; font-size:15.5px; color:#50269E; font-family:'AlmadenSans para',Inter,sans-serif; line-height:1.5; }
.ix-loc__list a{ color:#50269E; text-decoration:none; }
.ix-loc__list a:hover{ text-decoration:underline; }
.ix-loc__ic{ flex:0 0 auto; color:#50269E; margin-top:2px; }

@media (max-width:980px){
  .ix-contact{ background:#fff; padding:48px 20px 64px; }
  .ix-contact__inner{ grid-template-columns:1fr; gap:36px; }
  .ix-contact__right{ justify-content:stretch; }
  .ix-cform{ max-width:none; }
  .ix-locations__grid{ grid-template-columns:1fr; gap:30px; }
}
/* Locations banner: stack the headline above the flags. In the desktop flex row
   the flags hold their width and the text (max-width:520px) collapses into a
   narrow column that wraps to 1-2 words per line on tablets/phones. */
@media (max-width:768px){
  .ix-locbanner__inner{ flex-direction:column; align-items:flex-start; gap:20px; padding:24px 20px; }
  .ix-locbanner__text{ max-width:none; font-size:21px; }
}
@media (max-width:560px){
  .ix-cform__grid{ grid-template-columns:1fr; }
  .ix-contact__title{ font-size:30px; }            /* 40px H1 was too big on phones */
  .ix-contact__sub{ font-size:17px; }
  .ix-locbanner__text{ font-size:20px; }
  .ix-locations{ padding-bottom:56px; }
}

/* =========================================================================
   Case Study DETAIL page  (.ix-csd)  — gradient hero + info-card sidebar + prose + CTA
   ========================================================================= */
.ix-csd{ background:#fff; }
.ix-csd__byline{ font-family:"AlmadenSans para", Inter, sans-serif; font-size:.92rem; color:#666487; margin:6px 0 10px; }

/* Hero */
.ix-csd__hero{
	background:linear-gradient(90deg, rgba(247,247,248,.42) 0%, rgba(76,46,134,.13) 100%);
	padding:90px 0 150px;
	border-bottom:20px solid #4c2e86;
}
.ix-csd__hero-inner{
	width:min(1320px, calc(100% - 48px)); margin:0 auto;
	display:grid; grid-template-columns:1fr minmax(0, 620px); gap:60px; align-items:center;
}
.ix-csd__hero-text{ min-width:0; }
/* Breadcrumb above the hero heading ("Case Studies › <page>"): purple link, muted chevron, dark current.
   Kept on a single line — the current title truncates with an ellipsis if it's too long */
.ix-csd__crumbs{ display:flex; align-items:center; flex-wrap:nowrap; gap:8px; margin:0 0 22px; max-width:100%; font:600 15px/1.3 "AlmadenSans para", Inter, sans-serif; }
.ix-csd__crumbs a{ color:var(--purple); text-decoration:none; flex:0 0 auto; }
.ix-csd__crumbs a:hover{ text-decoration:underline; }
.ix-csd__crumb-sep{ color:#9aa0ab; flex:0 0 auto; }
.ix-csd__crumb-cur{ color:var(--text-dark); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ix-csd__title{
	font-family:"index happy font", Inter, sans-serif;
	font-size:clamp(2.125rem, 4.2vw, 3.125rem); line-height:1.2; font-weight:600;
	color:#000; margin:0;
}
.ix-csd__intro{
	font-family:"AlmadenSans para", Inter, sans-serif;
	font-size:1.25rem; line-height:1.2; color:#00053d;
	margin:18px 0 0; max-width:600px;
}
.ix-csd__hero-media{ min-width:0; }
.ix-csd__hero-media img{
	width:100%; aspect-ratio:640 / 400; object-fit:cover;
	border-radius:20px; display:block;
}

/* Body — two columns */
.ix-csd__body{
	width:min(1320px, calc(100% - 48px)); margin:0 auto; padding:0 0 24px;
	display:grid; grid-template-columns:396px 1fr; gap:84px; align-items:start;
}

/* Info card */
.ix-csd__card{
	background:#fff; border-radius:12px; border:1.5px solid #4c2e86;
	padding:40px; margin-top:-64px;
}
.ix-csd__logo{ display:block; max-height:30px; width:auto; margin:0 0 24px; }
.ix-csd__field{ margin:0 0 26px; }
.ix-csd__field:last-child{ margin-bottom:0; }
.ix-csd__label{
	font:600 16px/1.3 "AlmadenSans para", Inter, sans-serif; color:#666487; margin:0 0 12px;
}
.ix-csd__val{ font:400 16px/1.3 "AlmadenSans para", Inter, sans-serif; color:#666487; margin:0; }
.ix-csd__card ul{ margin:0; padding-left:20px; list-style:disc; }
.ix-csd__card li{ font:400 16px/1.3 "AlmadenSans para", Inter, sans-serif; color:#666487; margin:0; }
.ix-csd__card li::marker{ color:#666487; }
/* Case study sidebar: Products used + Share this post */
.ix-csd__card .ix-csd__prods{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:9px; }
.ix-csd__card .ix-csd__prods li{ list-style:none; padding:0; margin:0; }
.ix-csd__card .ix-csd__prods li::marker{ content:""; }
.ix-csd__prods .ix-csd__prod{ display:inline-flex; align-items:center; padding:7px 15px; border-radius:999px; background:#f1eefb; color:#50269E; font:600 14px/1 "AlmadenSans para", Inter, sans-serif; }
/* Archive cards: multiple product tags */
.ix-csa__tags{ display:inline-flex; flex-wrap:wrap; gap:8px; }
.ix-csd__share-btns{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.ix-csd__share-btn{ width:42px; height:42px; border-radius:50%; border:0; background:#f1eefb; color:#50269E; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:background .15s ease, color .15s ease; }
.ix-csd__share-btn:hover{ background:#50269E; color:#fff; }
.ix-csd__share-btn svg{ width:18px; height:18px; }
.ix-csd__share-btn.is-copied{ background:#16a34a; color:#fff; }

/* Prose */
.ix-csd__prose{ padding-top:24px; min-width:0; }
.ix-csd__prose > h2{
	font-family:"index happy font", Inter, sans-serif;
	font-size:2rem; line-height:1.2; font-weight:600; color:#000; margin:28px 0 20px;
}
.ix-csd__prose > h2:first-child{ margin-top:0; }
.ix-csd__prose h4, .ix-csd__sub{
	font-family:"index happy font", Inter, sans-serif;
	font-size:1.25rem; line-height:1.3; font-weight:600; color:#16182b; margin:24px 0 8px;
}
.ix-csd__prose p{
	font-family:"AlmadenSans para", Inter, sans-serif;
	font-size:1rem; line-height:1.5; color:#00053d; margin:0 0 14px;
}
.ix-csd__prose ul{ margin:0 0 14px; padding-left:22px; list-style:disc; }
.ix-csd__prose li{
	font-family:"AlmadenSans para", Inter, sans-serif;
	font-size:1rem; line-height:1.5; color:#00053d; margin:0 0 6px;
}

/* CTA */
.ix-csd__cta{
	width:min(1320px, calc(100% - 48px)); margin:56px auto 80px; border-radius:20px;
	background:#d1c8eb; padding:56px 24px; text-align:center;
}
.ix-csd__cta h2{
	font-family:"index happy font", Inter, sans-serif;
	font-size:2rem; line-height:1.25; font-weight:600; color:#00053d;
	margin:0 auto; max-width:560px;
}
.ix-csd__cta-btns{ display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:28px; }
.ix-csd__cta-btns a{
	display:inline-flex; align-items:center; justify-content:center;
	font:600 16px/1 'AlmadenSans para', Inter, sans-serif; text-decoration:none;
	background:#50269e; color:#fff; border-radius:12px; min-height:54px; padding:0 28px;
	transition:background .18s ease;
}
.ix-csd__cta-btns a.is-light{ background:#ece6ff; color:#50269e; }
.ix-csd__cta-btns a:hover{ background:#3f1d80; }
.ix-csd__cta-btns a.is-light:hover{ background:#ddd2ff; }

/* Responsive */
@media (max-width:900px){
	.ix-csd__hero{ padding:72px 0 90px; }
	.ix-csd__hero-inner{ grid-template-columns:1fr; gap:32px; }
	.ix-csd__hero-media img{ aspect-ratio:16 / 10; }
	.ix-csd__body{ grid-template-columns:1fr; gap:32px; }
	.ix-csd__card{ margin-top:-56px; padding:32px; }
	.ix-csd__prose{ padding-top:0; }
	.ix-csd__cta{ margin:48px auto 64px; padding:44px 18px; }
}

/* ===== About Us page (pixel-matched to staging) ===== */
.ix-aco{ background:#fff; padding:72px 24px; }
.ix-aco__inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
/* radius mirrors its sibling on the same page, .ix-acta__media img (20px = --radius-lg),
   so the two About photos read as one set instead of one square and one rounded */
.ix-aco__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; display:block; border-radius:20px; }
.ix-aco__title{ font-family:'index happy font',Inter,sans-serif; font-size:48px; line-height:1.1; font-weight:600; color:#0b0b0b; margin:0 0 22px; }
.ix-aco__body p{ font-size:17px; line-height:1.7; color:#3a3a3a; margin:0 0 18px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-aco__body p:last-child{ margin-bottom:0; }
.ix-aco__body a{ color:#50269E; text-decoration:none; }
.ix-aco__body a:hover{ text-decoration:underline; }
.ix-aco__body strong{ color:#0b0b0b; }

.ix-astory{ background:#0a0f3d; color:#fff; padding:80px 0; }
.ix-astory__inner{ max-width:1280px; margin:0 auto; padding:0 24px; }
.ix-astory__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; margin:0 0 48px; }
.ix-astory__intro-wrap{ max-width:880px; }
.ix-astory__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; font-weight:600; color:#fff; margin:0 0 16px; }
.ix-astory__intro{ font-size:18px; line-height:1.7; color:rgba(255,255,255,.8); margin:0; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-astory__nav{ display:flex; gap:12px; flex-shrink:0; }
.ix-astory__arrow{ width:42px; height:42px; border-radius:50%; border:1.5px solid rgba(255,255,255,.35); background:transparent; color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .2s, background .2s, transform .15s; }
.ix-astory__arrow:hover:not(:disabled){ border-color:rgba(255,255,255,.8); background:rgba(255,255,255,.08); }
.ix-astory__arrow:active:not(:disabled){ transform:scale(.95); }
.ix-astory__arrow:disabled{ opacity:.25; cursor:default; }
.ix-tl{ overflow-x:auto; padding-bottom:18px; scroll-snap-type:x mandatory; scroll-behavior:smooth; }
.ix-tl__track{ display:flex; min-width:max-content; }
.ix-tl__card{ flex:0 0 320px; width:320px; padding-right:28px; scroll-snap-align:start; position:relative; }
.ix-tl__card::before{ content:""; position:absolute; left:24px; top:24px; right:0; height:2px; background:rgba(255,255,255,.15); }
.ix-tl__card:last-child::before{ display:none; }
.ix-tl__icon{ position:relative; z-index:1; width:48px; height:48px; border-radius:14px; background:#3b5bfd; display:flex; align-items:center; justify-content:center; margin-bottom:22px; box-shadow:0 0 0 6px #0a0f3d; }
.ix-tl__year{ font-family:'index happy font',Inter,sans-serif; font-size:20px; font-weight:600; color:#fff; margin:0 0 12px; }
.ix-tl__desc{ font-size:15px; line-height:1.65; color:rgba(255,255,255,.72); margin:0; font-family:'AlmadenSans para',Inter,sans-serif; }
/* links in the timeline (e.g. founder LinkedIn) sit on the dark story card, so the
   brand-purple default is unreadable — force white + underline so they read as links */
.ix-tl__desc a{ color:#fff; text-decoration:underline; text-underline-offset:2px; font-weight:600; }
.ix-tl__desc a:hover{ color:#fff; opacity:.82; }
.ix-tl::-webkit-scrollbar{ height:6px; }
.ix-tl::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.2); border-radius:3px; }
.ix-tl::-webkit-scrollbar-track{ background:rgba(255,255,255,.05); }

.ix-amission{ background:#fff; padding:80px 24px; }
.ix-amission__inner{ max-width:1280px; margin:0 auto; text-align:center; }
.ix-amission__inner .badge-wrapper{ justify-content:center; }
.ix-amission__eyebrow{ font-size:14px; font-weight:600; color:#50269E; margin:0 0 12px; }
.ix-amission__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; font-weight:600; color:#0b0b0b; margin:10px 0 50px; }
.ix-amission__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:40px; text-align:left; }
.ix-vcard__ic{ display:flex; justify-content:center; margin-bottom:18px; }
.ix-vcard__ic svg{ width:64px; height:64px; display:block; }
.ix-vcard__title{ font-family:'index happy font',Inter,sans-serif; font-size:21px; font-weight:600; color:#0b0b0b; margin:0 0 12px; }
.ix-vcard__desc{ font-size:15px; line-height:1.65; color:#5a5a5a; margin:0; font-family:'AlmadenSans para',Inter,sans-serif; }

/* About — global footprint (stats band + office rows; full addresses live on Contact) */
.ix-aloc{ background:#fff; padding:20px 24px 90px; }
.ix-aloc__inner{ max-width:1180px; margin:0 auto; }
.ix-aloc__title{ font-family:'index happy font',Inter,sans-serif; font-size:40px; font-weight:600; color:#0b0b0b; text-align:center; margin:0 0 14px; }
.ix-aloc__sub{ font-size:17px; line-height:1.6; color:#3a3a3a; text-align:center; max-width:640px; margin:0 auto 44px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-aloc__stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:48px; }
.ix-aloc__stat{ background:#F7F4FF; border:1px solid #ECE6FF; border-radius:16px; padding:22px 18px; text-align:center; }
.ix-aloc__stat-num{ display:block; font-family:'index happy font',Inter,sans-serif; font-size:34px; font-weight:600; color:#50269E; line-height:1.1; margin-bottom:6px; }
.ix-aloc__stat-label{ font-size:14px; color:#3a3a3a; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-aloc__rows{ display:flex; flex-direction:column; gap:18px; }
.ix-aloc__row{ display:grid; grid-template-columns:220px 1fr; gap:26px; align-items:center; border:1px solid #ECE6FF; border-radius:20px; overflow:hidden; background:#fff; }
.ix-aloc__thumb{ height:100%; min-height:150px; }
.ix-aloc__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.ix-aloc__body{ padding:22px 26px 22px 0; }
.ix-aloc__role{ display:inline-block; padding:5px 12px; border-radius:999px; font:700 10.5px/1 'AlmadenSans para',Inter,sans-serif; letter-spacing:.5px; text-transform:uppercase; background:#ECE6FF; color:#50269E; margin-bottom:10px; }
.ix-aloc__name{ font-family:'index happy font',Inter,sans-serif; font-size:22px; font-weight:600; color:#0b0b0b; margin:0 0 8px; }
/* location name + thumb link to the matching office on /contact-us/. Keep the name in the
   heading colour (not the global purple link colour) so the design is unchanged; purple +
   underline appear only on hover to signal it is clickable. */
.ix-aloc__namelink{ color:inherit; text-decoration:none; }
.ix-aloc__namelink:hover{ color:var(--purple); text-decoration:underline; text-underline-offset:2px; }
.ix-aloc__thumb a{ display:block; height:100%; }
.ix-aloc__city{ color:#3a3a3a; font-weight:500; }
.ix-aloc__desc{ font-size:15.5px; line-height:1.6; color:#3a3a3a; margin:0; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-aloc__cta{ text-align:center; margin:34px 0 0; font-size:15.5px; color:#4a5568; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-aloc__cta a{ color:#50269E; font-weight:600; text-decoration:none; }
.ix-aloc__cta a::after{ content:"\00A0\2192"; }
.ix-aloc__cta a:hover{ text-decoration:underline; }

.ix-acta{ background:linear-gradient(90deg,#5d3aa0 0 42%,#3a1d6e 42% 100%); overflow:hidden; }
.ix-acta__inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:480px 1fr; gap:60px; align-items:center; padding:0 24px; min-height:300px; }
.ix-acta__media{ margin:-44px 0; }
.ix-acta__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; display:block; border-radius:20px; }
.ix-acta__title{ font-family:'index happy font',Inter,sans-serif; font-size:36px; font-weight:600; color:#fff; margin:0 0 14px; }
.ix-acta__sub{ font-size:18px; color:rgba(255,255,255,.85); margin:0 0 28px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-acta__btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#fff; color:#0b0b0b; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1; min-height:54px; padding:0 28px; border-radius:12px; text-decoration:none; }
.ix-acta__btn:hover{ background:#f0ecff; }

@media (max-width:980px){
  .ix-aco__inner{ grid-template-columns:1fr; gap:32px; }
  .ix-aco__title{ font-size:36px; }
  .ix-amission__grid{ grid-template-columns:1fr 1fr; gap:32px; }
  .ix-aloc__stats{ grid-template-columns:repeat(2,1fr); }
  .ix-aloc__row{ grid-template-columns:1fr; }
  .ix-aloc__thumb{ min-height:180px; }
  .ix-aloc__body{ padding:0 22px 22px; }
  .ix-acta{ background:#3a1d6e; }
  .ix-acta__inner{ grid-template-columns:1fr; gap:0; padding-bottom:40px; }
  .ix-acta__media{ margin:-30px 0 24px; max-width:420px; }
}
/* Our Story head: stack the intro ABOVE the prev/next arrows on tablets/phones.
   In the desktop flex row the arrow column steals horizontal space and squeezes
   the intro paragraph down its whole height, so it reads as a narrow column with
   the arrows floating in the empty space beside it. Stacking fixes both. */
@media (max-width:768px){
  .ix-astory{ padding:56px 0; }
  .ix-astory__head{ flex-direction:column; align-items:flex-start; gap:22px; margin-bottom:34px; }
  .ix-astory__intro-wrap{ max-width:none; }
}
@media (max-width:560px){
  .ix-amission__grid{ grid-template-columns:1fr; }
  .ix-tl__card{ flex-basis:280px; width:280px; }
  /* Phone rhythm: shrink the big 40/48px section headings (they wrapped to 3-4
     lines and dominated the viewport) and tighten the tall section padding. */
  .ix-aco{ padding:48px 20px; }
  .ix-aco__title{ font-size:30px; }
  .ix-astory__title{ font-size:30px; }
  .ix-astory__intro{ font-size:16px; }
  .ix-amission{ padding:52px 20px; }
  .ix-amission__title{ font-size:28px; margin-bottom:34px; }
  .ix-amission__grid{ text-align:center; }       /* center the whole stacked card — icon, title and text */
  .ix-aloc{ padding-bottom:56px; }
  .ix-aloc__title{ font-size:28px; }
  .ix-aloc__sub{ font-size:16px; margin-bottom:34px; }
}

/* ===== Blog listing page (/blog/) ===== */
.ix-bloghero{ background:#ECE6FF; padding:64px 24px; }
.ix-bloghero__inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center; }
.ix-bloghero__left{ min-width:0; }
.ix-bloghero__title{ font-family:'index happy font',Inter,sans-serif; font-size:48px; line-height:1.1; font-weight:600; color:#0b0b0b; margin:0 0 18px; }
.ix-bloghero__sub{ font-size:18px; line-height:1.5; color:#3a3a3a; margin:0 0 30px; max-width:520px; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-bloghero__bar{ display:flex; align-items:stretch; gap:0; background:#fff; border:2px solid #50269E; border-radius:14px; padding:6px; max-width:560px; }
.ix-bloghero__search{ display:flex; align-items:center; gap:10px; flex:1; padding:6px 14px; color:#50269E; }
.ix-bloghero__search input{ flex:1; min-width:0; border:0; outline:0; background:transparent; font-size:16px; color:#111; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-bloghero__search input::placeholder{ color:#8a8a8a; }
.ix-bloghero__cat{ border:0; border-left:1px solid #e2dcf5; background:#fff; padding:0 14px; font-size:15px; font-weight:500; color:#50269E; font-family:Inter,sans-serif; cursor:pointer; border-radius:0 8px 8px 0; }
.ix-bloghero__card{ display:block; background:#fff; border-radius:18px; overflow:hidden; text-decoration:none; box-shadow:0 22px 54px rgba(13,18,36,.12); transition:transform .2s ease; }
.ix-bloghero__card:hover{ transform:translateY(-4px); }
.ix-bloghero__card-img{ display:block; }
.ix-bloghero__card-img img{ width:100%; height:262px; object-fit:cover; display:block; }
.ix-bloghero__card-body{ display:block; padding:22px 26px 26px; }
.ix-bloghero__card-title{ display:block; font-family:'index happy font',Inter,sans-serif; font-size:22px; line-height:1.25; font-weight:600; color:#0b0b0b; margin-bottom:10px; }
.ix-bloghero__card-ex{ display:block; font-size:15px; line-height:1.5; color:#5a5a5a; font-family:'AlmadenSans para',Inter,sans-serif; }

.ix-bloglist{ background:#fff; padding:50px 24px 80px; }
.ix-bloglist__q .wp-block-post-template{ gap:30px; }
.ix-bloglist .ix-blog__card{ display:flex; flex-direction:column; height:100%; background:#fff; border:1px solid var(--border); border-radius:18px; overflow:hidden; padding:0; transition:box-shadow .2s ease, transform .2s ease; }
.ix-bloglist__q .wp-block-post{ height:100%; }   /* equal-height cards across the row */
.ix-blog__foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:auto 20px 18px; padding-top:14px; border-top:1px solid #f0eef7; }   /* margin-top:auto pins footer to the bottom so dates line up */
.ix-blog__foot .ix-blog__date{ margin:0; }
.ix-blog__more{ color:#50269E; font-weight:600; font-size:14px; text-decoration:none; font-family:'AlmadenSans para',Inter,sans-serif; white-space:nowrap; }
.ix-blog__more:hover{ text-decoration:underline; }
.ix-bloglist .ix-blog__card:hover{ box-shadow:0 18px 44px rgba(13,18,36,.10); transform:translateY(-4px); }
/* staging blog card: purple banner with title overlay + INDEXWORLD/odoo branding footer (no photo) */
.ix-blog__banner{ position:relative; display:flex; flex-direction:column; min-height:300px; overflow:hidden;
	background:linear-gradient(135deg, #6b35c4 0%, #3a1a7a 100%); }
.ix-blog__banner::before{ content:''; position:absolute; inset:0; pointer-events:none;
	background-image:
		radial-gradient(ellipse at top left, rgba(180,120,255,0.25) 0%, transparent 55%),
		radial-gradient(ellipse at bottom right, rgba(80,30,160,0.4) 0%, transparent 55%),
		radial-gradient(circle, rgba(255,255,255,0.1) 1px, transparent 1px);
	background-size:auto, auto, 22px 22px; border-radius:inherit; }
.ix-blog__banner-title{ margin:0; flex:1; position:relative; z-index:1; }
.ix-blog__banner-title a{ display:block; padding:30px 28px 18px; color:#fff; text-decoration:none; font-family:'index happy font',Inter,sans-serif; font-size:1.5rem; line-height:1.25; font-weight:600; }
.ix-blog__brandbar{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:16px; background:#ECE6FF; padding:14px 24px; margin-top:auto; }
.ix-blog__brand-iw{ height:24px; width:auto; display:block; }
.ix-blog__brand-odoo{ height:22px; width:auto; display:block; opacity:.9; }
.ix-blog__cats{ margin:16px 20px 0; display:flex; flex-wrap:wrap; gap:8px; }
.ix-blog__cats a,.ix-blog__cats span{ display:inline-block; background:#ECE6FF; color:#50269E; font-size:13px; font-weight:600; padding:5px 12px; border-radius:999px; text-decoration:none; font-family:Inter,sans-serif; }
.ix-blog__cats a:hover{ background:#ddd2ff; }
.ix-bloglist .ix-blog__title{ font-family:'index happy font',Inter,sans-serif; font-size:1.18rem; line-height:1.25; font-weight:600; margin:14px 20px 10px; }
.ix-bloglist .ix-blog__title a{ color:var(--text-dark); text-decoration:none; }
.ix-bloglist .ix-blog__title a:hover{ color:var(--purple); }
.ix-bloglist .ix-blog__excerpt{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.95rem; line-height:1.55; color:var(--text-mid); margin:16px 20px 12px; }
.ix-bloglist .ix-blog__excerpt .wp-block-post-excerpt__more-link{ display:inline-block; margin-top:8px; color:var(--purple); font-weight:600; text-decoration:none; }
.ix-blog__date{ margin:0 20px 20px; color:#50269E; font-size:14px; font-weight:600; font-family:'AlmadenSans para',Inter,sans-serif; }
/* pagination — numbered page buttons + prev/next pills */
.ix-blog__pag{ margin-top:60px; gap:10px; align-items:center; flex-wrap:wrap; }
.ix-blog__pag .wp-block-query-pagination-numbers{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ix-blog__pag .page-numbers{ display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; padding:0 10px; border-radius:12px; background:#F6F6F6; color:var(--text-dark); font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:15px; text-decoration:none; transition:background .15s ease, color .15s ease; }
.ix-blog__pag .page-numbers:hover{ background:#ECE6FF; color:#50269E; }
.ix-blog__pag .page-numbers.current{ background:#50269E; color:#fff; }
.ix-blog__pag .page-numbers.dots{ background:transparent; min-width:24px; color:var(--text-mid); }
.ix-blog__pag .wp-block-query-pagination-previous,
.ix-blog__pag .wp-block-query-pagination-next{ display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 20px; border-radius:12px; background:#ECE6FF; color:#50269E; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:14px; text-decoration:none; transition:background .15s ease, opacity .15s ease; }
.ix-blog__pag .wp-block-query-pagination-previous:hover,
.ix-blog__pag .wp-block-query-pagination-next:hover{ background:#ddd2ff; }
.ix-blog__pag .wp-block-query-pagination-previous-arrow,
.ix-blog__pag .wp-block-query-pagination-next-arrow{ font-size:18px; line-height:1; margin:0; }
@media (max-width:980px){ .ix-bloghero__inner{ grid-template-columns:1fr; gap:36px; } .ix-bloghero__title{ font-size:34px; } }
@media (max-width:680px){
  /* Stack search over category. The category's desktop divider is a LEFT border
     with right-only radius; once wrapped that shows as a stray vertical line and
     the select only spans its text width. Make it a full-width row with a TOP
     divider and a larger tap target instead. */
  .ix-bloghero__bar{ flex-wrap:wrap; }
  .ix-bloghero__search{ flex:1 1 100%; }
  .ix-bloghero__cat{ flex:1 1 100%; width:100%; border-left:0; border-top:1px solid #e2dcf5; border-radius:0 0 8px 8px; padding:12px 14px; }
}

/* ===== Single blog post (single.html) — staging two-column design ===== */
.ix-post{ padding:30px 24px 80px; }
.ix-post__wrap{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:56px; max-width:1240px; margin:0 auto; align-items:start; }
.ix-post__main{ min-width:0; }

/* featured-image cover card + overlapping date pill */
.ix-post__cover{ position:relative; margin:0 0 56px; min-height:340px; border-radius:18px; overflow:visible; }
.ix-post__cover .ix-blog__brandbar{ border-radius:0 0 18px 18px; }
.ix-post__cover-title{ flex:1; margin:0; position:relative; z-index:1; color:#fff; font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:2.5rem; line-height:1.2; padding:44px 44px 18px; }
.ix-post__datepill{ position:absolute; left:24px; bottom:-26px; margin:0; z-index:2; background:#fff; color:var(--text-dark); padding:10px 20px; border-radius:10px; box-shadow:0 8px 24px rgba(0,5,61,.12); font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; font-weight:600; }
.ix-post__datepill time, .ix-post__datepill a{ color:inherit; text-decoration:none; }

.ix-post__title{ font-family:'index happy font',Inter,sans-serif; font-size:2.25rem; line-height:1.18; font-weight:600; color:var(--text-dark); margin:6px 0 18px; }
.ix-post__cats{ margin:0 0 28px; }
.ix-post__cats a{ display:inline-block; background:#ECE6FF; color:#50269E; font-family:'AlmadenSans para',Inter,sans-serif; font-size:13px; font-weight:600; padding:7px 14px; border-radius:20px; text-decoration:none; }

/* article body */
.ix-post__body{ max-width:none; }
/* fill the full text column (align with the hero/cover above) instead of the 768px constrained content width */
.ix-post__body.is-layout-constrained > *{ max-width:none; margin-left:0; margin-right:0; }
.ix-post__body p{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.0625rem; line-height:1.75; color:var(--text-mid); margin:0 0 22px; }
.ix-post__body em, .ix-post__body i{ font-style:normal; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-post__body h2{ font-family:'index happy font',Inter,sans-serif; font-size:2rem; font-weight:600; color:var(--text-dark); margin:42px 0 16px; line-height:1.2; }
.ix-post__body h3{ font-family:'index happy font',Inter,sans-serif; font-size:1.5rem; font-weight:600; color:var(--text-dark); margin:32px 0 12px; line-height:1.25; }
.ix-post__body ul, .ix-post__body ol{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.0625rem; line-height:1.7; color:var(--text-mid); margin:0 0 22px; padding-left:24px; }
.ix-post__body li{ margin-bottom:8px; }
.ix-post__body img{ max-width:100%; height:auto; border-radius:14px; }
.ix-post__body a{ color:#50269E; }
.ix-post__body blockquote{ border-left:4px solid #ECE6FF; margin:24px 0; padding:6px 0 6px 22px; color:var(--text-dark); font-style:italic; }
.ix-post__body table{ width:100%; border-collapse:separate; border-spacing:0; margin:0 0 30px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:15.5px; line-height:1.5; border:1px solid #ECE6FF; border-radius:18px; overflow:hidden; box-shadow:0 12px 34px rgba(80,38,158,.07); }

/* Post-body wide content: give tables and code blocks their own horizontal scroller.
   width:100% does not help a table whose min-content exceeds the column -- the training
   post table measured 325px inside a 252px body at 300px wide, and the JSON-RPC post
   rendered <code> lines up to 565px with white-space:pre and no scroller, so both ran
   off the right edge. The markup cannot be wrapped in a scroll div (page content is not
   ours to change here), so the scroller goes on the element itself. display:block is
   required for overflow to take on a table; overflow-y stays hidden so the 18px radius
   still clips. Verified 2026-08-28: at 300px the table goes 325 -> 252 and both pages
   report zero overflow; at 1440px cells measure 164/351/339 against 165/352/340 before,
   i.e. unchanged within rounding. */
.ix-post__body pre{ overflow-x:auto; max-width:100%; }
/* Owner, 2026-08-28: the scroller alone made it worse -- a 4-column table compressed to
   the 252px body gives ~84px columns and one word per line. Give the cells a floor and
   let the scroller carry the width instead. 200px yields 2 words per line (3 lines for
   the longest cell); 180 still gave 1.5 and anything past 200 only adds scrolling for
   no gain. The first column holds short row labels, so it keeps a 104px floor -- that
   alone cuts the scroll from 801px to 705px.
   Scoped to <=700px on purpose: display:block stops a table honouring width:100%, and
   unscoped it made this table scroll 883 in an 857 column at 1440. Verified ON vs OFF
   identical at 1024 and 1440 (display:table, cells 110/161/163/170 and 132/228/234/263). */
@media (max-width:700px){
	.ix-post__body table{ display:block; overflow-x:auto; overflow-y:hidden; }
	.ix-post__body table th, .ix-post__body table td{ min-width:200px; }
	.ix-post__body table th:first-child, .ix-post__body table td:first-child{ min-width:104px; }
}

.ix-post__body th, .ix-post__body td{ padding:16px 22px; text-align:left; color:var(--text-dark); vertical-align:top; border:0; }
.ix-post__body thead th{ background:#F4F1FE; color:#50269E; font-weight:600; font-size:13px; letter-spacing:.04em; text-transform:uppercase; border-bottom:1px solid #E4DCFA; }
.ix-post__body tbody td{ border-bottom:1px solid #F0ECF9; }
.ix-post__body tbody tr:last-child td{ border-bottom:none; }
.ix-post__body tbody tr:nth-child(even) td{ background:#FBFAFF; }
.ix-post__body tbody td:first-child{ font-weight:600; color:#1c1733; }

/* sticky "Recent Posts" sidebar */
/* --- post body: professional typography polish --- */
.ix-post__body > :first-child{ margin-top:0; }
.ix-post__body p{ color:#3c4150; font-size:1.125rem; line-height:1.8; margin:0 0 22px; }            /* 18px, comfortable for reading */
.ix-post__body > p:first-of-type{ font-size:1.3rem; line-height:1.65; color:var(--text-dark); }    /* lead paragraph */
.ix-post__body p:has(+ ul), .ix-post__body p:has(+ ol){ margin-bottom:8px; }                       /* tighten lead-in before a list */
.ix-post__body ul, .ix-post__body ol{ font-size:1.125rem; line-height:1.8; margin:4px 0 22px; padding-left:22px; }
.ix-post__body li{ margin-bottom:9px; padding-left:4px; }
.ix-post__body li::marker{ color:#50269E; }
.ix-post__body strong, .ix-post__body b{ font-weight:700; color:var(--text-dark); }
.ix-post__body a strong, .ix-post__body a b, .ix-post__body a em, .ix-post__body a i{ color:inherit; }
.ix-post__body a{ text-decoration:none; }
.ix-post__body a:hover{ text-decoration:underline; text-underline-offset:2px; }
.ix-post__body img{ display:block; margin:30px 0; }

.ix-post__side{ position:static; }   /* scrolls with the page (not fixed) */
.ix-post__side-h{ font-family:'index happy font',Inter,sans-serif; font-size:1.25rem; font-weight:600; color:var(--text-dark); margin:0 0 18px; }
.ix-recent .wp-block-post{ margin:0 0 15px; padding:0; border:0; }
.ix-recent .wp-block-post:last-child{ margin-bottom:0; }
/* recent-post card: readable title + excerpt, purple left accent, clean vertical list */
.ix-recent__item{ position:relative; background:#fff; border:1px solid #efedf6; border-left:3px solid #50269E; border-radius:12px; padding:15px 18px; transition:box-shadow .25s ease, transform .25s ease, border-color .25s ease; }
.ix-recent__item:hover{ box-shadow:0 12px 28px rgba(80,38,158,.12); transform:translateY(-2px); }
.ix-recent__t{ margin:0 0 7px; }
.ix-recent__t a{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:var(--text-dark); text-decoration:none; font-family:'index happy font',Inter,sans-serif; font-size:15px; line-height:1.25; font-weight:600; }
.ix-recent__t a::after{ content:''; position:absolute; inset:0; z-index:1; }   /* whole card clickable */
.ix-recent__item:hover .ix-recent__t a{ color:#50269E; }
.ix-recent__ex{ margin:0; }
.ix-recent__ex p{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:0; font-family:'AlmadenSans para',Inter,sans-serif; font-size:13px; line-height:1.55; color:#6b6e7e; }

/* "Related Blogs" full-width row */
.ix-post__related{ margin-top:70px; padding-top:50px; border-top:1px solid #eee; }
.ix-post__related-h{ font-family:'index happy font',Inter,sans-serif; font-size:1.875rem; font-weight:600; color:var(--text-dark); margin:0 0 28px; text-align:center; }
/* Reuse the /blog/ card design: equal-height flex columns so cards top-align and the date row pins to the bottom */
.ix-post__related-grid .ix-blog__card{ display:flex; flex-direction:column; height:100%; position:relative; cursor:pointer; }
/* whole-card click: stretch the footer "Read more" link over the whole card (anchored to the card, not the overflow-hidden banner); keep category pills clickable above it */
.ix-post__related-grid .ix-blog__more::after{ content:''; position:absolute; inset:0; z-index:1; }
.ix-post__related-grid .ix-blog__cats a{ position:relative; z-index:2; }
.ix-related__grid .wp-block-post-template{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.ix-related__grid .wp-block-post{ background:#fff; border:1px solid #eee; border-radius:16px; overflow:hidden; position:relative; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease; }
.ix-related__grid .wp-block-post:hover{ transform:translateY(-5px); box-shadow:0 20px 44px rgba(13,18,36,.14); }
/* whole-card click: stretch the title link over the entire card; keep category/read-more clickable above it */
.ix-related__title a::after{ content:''; position:absolute; inset:0; z-index:1; }
.ix-related__cat a, .ix-related__ex .wp-block-post-excerpt__more-link{ position:relative; z-index:2; }
.ix-related__banner{ min-height:200px; }
.ix-related__banner .ix-blog__banner-title a{ padding:22px 20px 14px; font-size:1.125rem; }
.ix-related__banner .ix-blog__brandbar{ padding:11px 18px; }
.ix-related__banner .ix-blog__brand-iw{ height:18px; }
.ix-related__banner .ix-blog__brand-odoo{ height:16px; }
.ix-related__cat{ margin:16px 18px 0; }
.ix-related__cat a{ background:#ECE6FF; color:#50269E; font-size:12px; font-weight:600; padding:5px 12px; border-radius:16px; text-decoration:none; font-family:'AlmadenSans para',Inter,sans-serif; }
.ix-related__title{ margin:12px 18px 0; }
.ix-related__title a{ font-family:'index happy font',Inter,sans-serif; font-size:1.125rem; font-weight:600; line-height:1.25; color:var(--text-dark); text-decoration:none; }
.ix-related__ex{ margin:10px 18px 0; }
.ix-related__ex p, .ix-related__ex .wp-block-post-excerpt__excerpt{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; line-height:1.6; color:#333; margin:5px; }
.ix-related__ex .wp-block-post-excerpt__more-link{ display:inline-block; margin-top:10px; color:#50269E; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; font-weight:600; text-decoration:none; }
.ix-related__ex .wp-block-post-excerpt__more-link:hover{ text-decoration:underline; }
.ix-related__date{ margin:14px 18px 18px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:13px; color:var(--text-mid); }

@media (max-width:980px){
	.ix-post__wrap{ grid-template-columns:1fr; gap:40px; }
	.ix-post__side{ position:static; }
	.ix-related__grid .wp-block-post-template{ grid-template-columns:1fr 1fr; }
}
@media (max-width:680px){
	.ix-post__title{ font-size:1.85rem; }
	.ix-related__grid .wp-block-post-template{ grid-template-columns:1fr; }
}

/* =========================================================================
   MOBILE POLISH PASS — safety nets + dedicated small-phone tier (≤480px)
   Additive + scoped; does not affect desktop. Added during mobile QA.
   ========================================================================= */

/* Safety nets — stop any stray full-bleed element from causing horizontal scroll,
   and keep all media inside its box. overflow-x:clip preserves position:sticky. */
html, body { overflow-x: clip; max-width: 100%; }

/* ===================================================================
   GLOBAL DESKTOP SCALE (owner request: render the site at ~97%, i.e. the
   same as viewing it at 97% browser zoom).

   CSS `zoom` is the only property that scales a px-based design uniformly
   the way browser zoom does; transform:scale() would leave a gap at the
   bottom and break the fixed header, and html{font-size:90%} would do
   nothing here because the stylesheet is ~2,780 px values to ~130 rem.

   SIDE EFFECT, deliberate and contained: zoom also enlarges the layout
   viewport, so a 1440px window lays out as if it were 1600px. That is
   exactly why it is scoped to >=1025px. Left unscoped, a 900px tablet
   would report ~1000px and wrongly pick up desktop rules. Phones and
   tablets are untouched and render at 100%.

   To revert: delete this block. To tune: change 0.97 only.
   =================================================================== */
@media (min-width:1025px){
	html{ zoom:0.97; }
}
img, svg, video, iframe { max-width: 100%; }

/* Native smooth anchor scrolling. scroll-padding-top offsets the fixed 78–84px
   header so in-page anchor jumps don't land hidden under it. Disabled for
   reduced-motion visitors (they keep instant, non-animated scrolling). */
@media (prefers-reduced-motion: no-preference){
	html { scroll-behavior: smooth; }
}
html { scroll-padding-top: 96px; }

/* Small phones (≤480px): trim oversized headings + section padding for a clean,
   readable single-column flow. */
@media (max-width:480px){
	/* Homepage hero */
	.ix-hero{ padding-left:18px; padding-right:18px; }
	.ix-hero__title{ font-size:1.85rem; line-height:1.18; }
	.ix-hero__sub{ font-size:1rem; line-height:1.55; }

	/* Shared section headings */
	.ix-sec-title{ font-size:1.7rem; line-height:1.15; }
	.ix-iwhat__title{ font-size:1.7rem; }

	/* Case study detail */
	.ix-csd__title{ font-size:1.85rem; }
	.ix-csd__prose > h2{ font-size:1.55rem; }
	.ix-csd__cta h2{ font-size:1.6rem; }

	/* Case studies archive (listing) */
	.ix-csa{ padding-left:16px; padding-right:16px; }
	.ix-csa__title{ font-size:1.85rem; }

	/* CTA / about-cta / contact headings */
	.ix-ctap__title, .ix-acta__title, .ix-cform__title, .ix-bloghero__title{ font-size:1.85rem !important; }

	/* Comfortable section rhythm on phones */
	.ix-blog, .ix-services, .ix-industries-section, .ix-proof, .ix-trusted{ padding-top:48px; padding-bottom:48px; }
}

.ix-bloglist__empty{ text-align:center; color:#5a5a5a; font-size:17px; font-family:'AlmadenSans para',Inter,sans-serif; margin:30px 0 0; }
.ix-bloghero__cat{ cursor:pointer; }

/* Blog listing — custom PHP grid (server-side filter + pagination) */
.ix-bloglist__inner{ max-width:1280px; margin:0 auto; }
.ix-bloglist__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; align-items:stretch; }
.ix-blog__pag{ display:flex; justify-content:center; }
.ix-bloglist__empty{ text-align:center; color:#5a5a5a; font-size:17px; font-family:'AlmadenSans para',Inter,sans-serif; padding:30px 0; }
.ix-bloglist__empty a{ color:#50269E; font-weight:600; }
@media (max-width:980px){ .ix-bloglist__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:680px){ .ix-bloglist__grid{ grid-template-columns:1fr; } }

/* homepage Our Insights banner cards (match staging card-gradient-bg) */
.ix-blog__grid .wp-block-post{ height:100%; }
.ix-blog .ix-blog__card{ display:flex; flex-direction:column; height:100%; }
.ix-blog .ix-blog__excerpt{ margin:0 20px 22px; }
.ix-blog .ix-blog__excerpt .wp-block-post-excerpt__more-link{ display:none; }

/* remove the comma separator between category pills (root-level, all post-terms) */
.wp-block-post-terms__separator{ display:none; }

/* tag on banner (improved card) — white pill, title tucked under, cleaner footer */
.ix-blog__banner .ix-blog__cats{ position:relative; z-index:1; margin:0; padding:22px 26px 0; display:flex; flex-wrap:wrap; gap:8px; }
.ix-blog__banner .ix-blog__cats a,.ix-blog__banner .ix-blog__cats span{ display:inline-flex; align-items:center; line-height:1; background:#fff; color:#4a2a9e; font-family:'AlmadenSans para',Inter,sans-serif; font-size:12px; font-weight:600; padding:8px 15px; border-radius:12px; text-decoration:none; transition:background .15s ease, filter .15s ease; }
.ix-blog__banner .ix-blog__cats a:hover{ filter:brightness(0.96); }
.ix-blog__banner-title a{ padding:12px 26px 18px; }
.ix-blog__card{ border-radius:20px; }
.ix-bloglist .ix-blog__card{ border-radius:20px; }
.ix-blog__foot{ border-top:none; padding-top:0; }

.wp-block-post-excerpt__excerpt{ margin:5px; }

/* ============ Home "From the Blog" carousel (.ix-blogcar) — house carousel recipe ============ */
.ix-blogcar{ padding:80px 0; background:#f7f7fb; }
.ix-blogcar__head{ text-align:center; max-width:1120px; margin:0 auto 40px; padding:0 24px; }
.ix-blogcar__eyebrow{ display:flex; justify-content:center; margin:0 0 16px; }
.ix-blogcar .ix-sec-title{ margin-bottom:0; }
.ix-blogcar__viewport{ overflow-x:hidden; overflow-y:visible; max-width:1200px; margin:0 auto; padding:8px 24px; touch-action:pan-y; cursor:grab; }
.ix-blogcar__viewport:active{ cursor:grabbing; }
.ix-blogcar__card img{ -webkit-user-drag:none; user-select:none; }
.ix-blogcar__track{ display:flex; gap:24px; transition:transform .55s cubic-bezier(.22,.61,.36,1); will-change:transform; }
.ix-blogcar__card{ flex:0 0 360px; width:360px; display:flex; flex-direction:column; }
.ix-blogcar__nav{ display:flex; align-items:center; justify-content:space-between; gap:20px; margin:30px auto 0; max-width:1232px; padding:0 24px; position:relative; }
.ix-blogcar__abtn{ width:54px; height:54px; flex:0 0 54px; border:0; border-radius:50%; background:#ECE6FF; color:#00053D; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s ease; }
.ix-blogcar__abtn:hover:not(:disabled){ background:#ddd2ff; }
.ix-blogcar__abtn:disabled{ opacity:.4; cursor:default; }
.ix-blogcar__dots{ display:flex; align-items:center; gap:16px; position:absolute; left:50%; transform:translateX(-50%); }
.ix-blogcar__dot{ width:10px; height:10px; padding:0; border:0; border-radius:50%; background:#D6D1E8; cursor:pointer; transition:width .3s ease, background .3s ease; }
.ix-blogcar__dot.is-active{ width:26px; border-radius:5px; background:#060038; }
.ix-blogcar__all{ text-align:center; margin:28px auto 0; padding:0 24px; }
.ix-blogcar__all a{ color:#50269E; font-weight:600; text-decoration:none; }
.ix-blogcar__all a:hover{ text-decoration:underline; }
@media (max-width:900px){
	.ix-blogcar{ padding:60px 0; }
	.ix-blogcar__head{ margin-bottom:30px; }
	.ix-blogcar__viewport{ max-width:none; padding:8px 0; }   /* full-bleed for centered-peek */
	.ix-blogcar__card{ flex:0 0 82vw; width:82vw; }
	.ix-blogcar__track{ padding:0 9vw; }                       /* (100vw - 82vw)/2 centers the active card */
	.ix-blogcar__abtn{ display:none; }                          /* phone: swipe + dots only */
	.ix-blogcar__nav{ margin-top:22px; }
}

/* ── Section rhythm (all pages) ──
   Remove the theme's default 24px block-gap that sits between every section, so spacing
   is driven only by each section's own padding. Homepage Hero + Case Studies keep their
   negative overlap margins (set in their own rules), so they're excluded. */
main > section:not(.ix-hero):not(.ix-cases),
main > .wp-block-group:not(.ix-hero):not(.ix-cases){ margin-top:0; }
/* inner pattern-composed pages (Contact/About/Blog/industry) render sections inside .entry-content */
.page-template-industry .entry-content > section,
.page-template-industry .entry-content > .wp-block-group{ margin-top:0; }

/* ============ Industries landing: Hero (.ix-indhero) — two-column text + image ============ */
.ix-indhero{ background:#ECE6FF; padding:72px 24px; }
.ix-indhero__inner{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.ix-indhero__text{ min-width:0; }
.ix-indhero__badge{ display:flex; justify-content:flex-start; margin:0 0 16px; }
.ix-indhero__title{ font-family:'index happy font',Inter,sans-serif; font-size:46px; line-height:1.1; font-weight:600; color:#0b0b0b; margin:0 0 16px; text-wrap:balance; }
.ix-indhero__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.15rem; line-height:1.5; color:#3a3a3a; max-width:560px; margin:0 0 28px; }
.ix-indhero__cta{ display:flex; justify-content:flex-start; gap:14px; flex-wrap:wrap; margin:0 0 38px; }
.ix-indhero__btn{ display:inline-flex; align-items:center; gap:8px; height:54px; padding:0 26px; border-radius:12px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px; font-weight:600; text-decoration:none; transition:background .2s ease, border-color .2s ease, transform .15s ease; }
.ix-indhero__btn--dark{ background:#50269E; color:#fff; }
.ix-indhero__btn--dark:hover{ background:#3f1d80; }
.ix-indhero__btn--ghost{ background:#fff; color:#50269E; border:1.5px solid #d7c9f5; }
.ix-indhero__btn--ghost:hover{ border-color:#50269E; }
.ix-indhero__stats{ display:flex; justify-content:flex-start; flex-wrap:wrap; gap:18px 44px; }
.ix-indhero__stat{ display:flex; flex-direction:column; }
.ix-indhero__num{ font-family:'index happy font',Inter,sans-serif; font-size:38px; font-weight:700; color:#50269E; line-height:1; }
.ix-indhero__lbl{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; color:#5a5275; margin-top:8px; }
.ix-indhero__media{ min-width:0; }
.ix-indhero__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; display:block; }
@media (max-width:900px){
	.ix-indhero__inner{ grid-template-columns:1fr; gap:34px; text-align:center; }
	.ix-indhero__badge,.ix-indhero__cta,.ix-indhero__stats{ justify-content:center; }
	.ix-indhero__sub{ margin-left:auto; margin-right:auto; }
	.ix-indhero__stats{ gap:18px 36px; }
	.ix-indhero__media{ order:-1; max-width:440px; margin:0 auto; }
}

/* .ix-indwhy was MERGED into .ix-ichal (Icon Card Grid) on 2026-06-22 — its CSS removed. */
@media (max-width:768px){
	.ix-indhero{ padding:60px 18px 56px; }
	.ix-indhero__title{ font-size:34px; }
	.ix-indhero__sub{ font-size:1.05rem; }
	.ix-indhero__stats{ gap:22px 36px; }
	.ix-indhero__num{ font-size:32px; }
}

/* =====================================================================
   SUPPORT PAGE (/support/) — cloned from staging. Scoped under .ix-sup*
   ===================================================================== */
.ix-sup-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; height:52px; padding:0 26px; border-radius:12px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px; font-weight:600; text-decoration:none; transition:background .2s ease, border-color .2s ease, color .2s ease; white-space:nowrap; }
.ix-sup-btn--primary{ background:#50269E; color:#fff; }
.ix-sup-btn--primary:hover{ background:#3f1d80; }
.ix-sup-btn--outline{ background:#fff; color:#50269E; border:1.5px solid #d7c9f5; }
.ix-sup-btn--outline:hover{ border-color:#50269E; }
.ix-sup-btn--link{ height:auto; padding:0; background:none; color:#50269E; }
.ix-sup-btn--link:hover{ text-decoration:underline; }
.ix-sup-chk{ color:#50269E; flex:0 0 auto; }

/* Hero — white, two-column (text + image). No eyebrow (house rule). */
.ix-sup-hero{ background:#fff; padding:72px 24px; }
.ix-sup-hero__inner{ max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.ix-sup-hero__text{ min-width:0; }
.ix-sup-hero__title{ font-family:'index happy font',Inter,sans-serif; font-size:56px; line-height:1.08; font-weight:600; color:#0b0b0b; margin:0 0 22px; }
.ix-sup-hero__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.15rem; line-height:1.5; color:#3a3a3a; max-width:560px; margin:0 0 30px; }
.ix-sup-hero__cta{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin:0 0 30px; }
.ix-sup-hero__checks{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:12px 28px; }
.ix-sup-hero__checks li{ display:flex; align-items:center; gap:8px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; color:#3a3a3a; }
.ix-sup-hero__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; border-radius:18px; display:block; }

/* Plans — 4 cards, 4th featured */
.ix-sup-plans{ background:linear-gradient(180deg,#2a2160 0%,#171236 100%); padding:64px 24px 84px; }
.ix-sup-plans .ix-sec-title{ color:#fff; }
.ix-sup-plans .ix-sec-sub{ color:#d3cfe8; }
.ix-sup-plan__feats a{ color:#50269E; text-decoration:none; font-weight:600; }
.ix-sup-plan__feats a:hover{ text-decoration:underline; text-underline-offset:2px; }
.ix-sup-plans__inner{ max-width:1280px; margin:0 auto; text-align:center; }
.ix-sup-plans__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:46px; align-items:start; text-align:left; }
.ix-sup-plan{ position:relative; background:#fff; border:1px solid #e7e3f3; border-radius:18px; padding:32px 26px; display:flex; flex-direction:column; box-shadow:0 10px 30px rgba(0,5,61,.04); }
.ix-sup-plan--featured{ border:2px solid #50269E; box-shadow:0 24px 56px rgba(80,38,158,.18); }
.ix-sup-plan__badge{ position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:#50269E; color:#fff; font-family:'AlmadenSans para',Inter,sans-serif; font-size:12px; font-weight:700; letter-spacing:.02em; padding:7px 18px; border-radius:999px; white-space:nowrap; }
.ix-sup-plan__name{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:17px; font-weight:600; color:#555; margin:0 0 6px; }
.ix-sup-plan__price{ margin:0 0 14px; display:flex; align-items:baseline; gap:6px; }
.ix-sup-plan__amount{ font-family:'index happy font',Inter,sans-serif; font-size:42px; font-weight:700; color:#0b0b0b; line-height:1; }
.ix-sup-plan__unit{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; color:#6b6b6b; }
.ix-sup-plan__tag{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:15.5px; color:#5a5a5a; line-height:1.5; margin:0 0 22px; min-height:46px; }
.ix-sup-plan__cta{ width:100%; margin:0 0 24px; }
.ix-sup-plan__feats{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
.ix-sup-plan__feats li{ display:flex; gap:10px; align-items:flex-start; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14.5px; line-height:1.45; color:#3a3a3a; }
.ix-sup-plan__feats .ix-sup-chk{ margin-top:1px; }

/* Why — light band, centered, 3 icon cards */
.ix-sup-why{ background:#f7f7fb; padding:80px 24px; text-align:center; }
.ix-sup-why__inner{ max-width:1120px; margin:0 auto; }
.ix-sup-why__eyebrow{ display:flex; justify-content:center; margin:0 0 16px; }
.ix-sup-why__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; margin-top:46px; }
.ix-sup-why__ic{ display:inline-flex; color:#50269E; margin-bottom:18px; }
.ix-sup-why__title{ font-family:'index happy font',Inter,sans-serif; font-size:1.5rem; font-weight:600; color:#0b0b0b; margin:0 0 10px; }
.ix-sup-why__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1rem; line-height:1.5; color:#5a5a5a; max-width:340px; margin:0 auto; }

/* Comparison table */
.ix-sup-cmp{ background:#fff; padding:80px 24px; text-align:center; }
.ix-sup-cmp__inner{ max-width:1080px; margin:0 auto; }
.ix-sup-cmp__table{ margin:38px auto 0; border:1px solid #ece9f5; border-radius:16px; overflow:hidden; text-align:left; }
.ix-sup-cmp__row{ display:grid; grid-template-columns:1.3fr 1fr 1fr; border-bottom:1px solid #efedf6; }
.ix-sup-cmp__row:last-child{ border-bottom:0; }
.ix-sup-cmp__cell{ padding:18px 22px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:15.5px; color:#3a3a3a; display:flex; align-items:center; justify-content:center; text-align:center; }
.ix-sup-cmp__cell--label{ justify-content:flex-start; text-align:left; font-weight:700; color:#0b0b0b; }
.ix-sup-cmp__cell--hero{ background:#f4f0fc; }
.ix-sup-cmp__row--head .ix-sup-cmp__cell{ background:#ECE6FF; font-weight:700; color:#0b0b0b; }
.ix-sup-cmp__row--head .ix-sup-cmp__cell--hero{ background:#50269E; color:#fff; }
.ix-sup-cmp__row--total .ix-sup-cmp__cell{ font-weight:700; color:#0b0b0b; background:#faf9fe; }
.ix-sup-cmp__row--total .ix-sup-cmp__cell--hero{ background:#ece6ff; }
.ix-sup-cmp__act{ margin-top:30px; }

/* Feature sections — alternating media + text */
.ix-sup-feat{ background:#fff; padding:60px 24px; }
.ix-sup-feat__inner{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.ix-sup-feat--rev .ix-sup-feat__media{ order:2; }
.ix-sup-feat__media img{ width:100%; aspect-ratio:16/9; height:auto; object-fit:cover; object-position:center; border-radius:18px; display:block; box-shadow:0 18px 50px rgba(13,18,36,.10); }
.ix-sup-feat__title{ font-family:'index happy font',Inter,sans-serif; font-size:2.1rem; line-height:1.18; font-weight:600; color:#0b0b0b; margin:0 0 16px; }
.ix-sup-feat__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.12rem; line-height:1.5; color:#4a4a4a; margin:0; }
/* FAQ — reuses the shared .ix-ifaq component (faq.php styles + faq-accordion.js smooth single-open) */

@media (max-width:1024px){
	.ix-sup-plans__grid{ grid-template-columns:repeat(2,1fr); gap:22px 20px; }
	.ix-sup-plan__badge{ top:-12px; }
}
@media (max-width:980px){
	.ix-sup-hero__inner{ grid-template-columns:1fr; gap:34px; }
	.ix-sup-hero__title{ font-size:40px; }
	.ix-sup-hero__media{ order:-1; }
	.ix-sup-why__grid{ grid-template-columns:1fr; max-width:520px; margin-left:auto; margin-right:auto; }
	.ix-sup-feat__inner{ grid-template-columns:1fr; gap:28px; }
	.ix-sup-feat--rev .ix-sup-feat__media{ order:-1; }
	.ix-sup-feat__media{ order:-1; }
	.ix-sup-cmp__cell{ padding:14px 14px; font-size:14px; }
}
@media (max-width:640px){
	.ix-sup-plans__grid{ grid-template-columns:1fr; max-width:420px; margin-left:auto; margin-right:auto; }
	.ix-sup-hero__title{ font-size:33px; }
	.ix-sup-feat__title{ font-size:1.7rem; }
}

/* ============================================================
   Mobile slide-in drawer menu (.ixm-*)  — ported from staging
   ============================================================ */
:root{
  --ixm-purple:#50269E;
  --ixm-purple-lt:#6b3fc4;
  --ixm-purple-bg:#f0ebff;
  --ixm-purple-icon:#EDE7FF;
  --ixm-white:#ffffff;
  --ixm-text:#0d1224;
  --ixm-text-mid:#4a5568;
  --ixm-text-light:#8892a4;
  --ixm-border:#eaecf0;
  --ixm-bg:#f8f9fc;
  --ixm-radius:14px;
  --ixm-shadow:0 20px 60px rgba(13,18,36,.22);
  --ixm-speed:.42s;
}

/* backdrop */
.ixm-backdrop{ position:fixed; inset:0; background:rgba(13,18,36,.45); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); z-index:9998; opacity:0; visibility:hidden; transition:opacity var(--ixm-speed) ease, visibility var(--ixm-speed) ease; }
.ixm-backdrop.open{ opacity:1; visibility:visible; }

/* overlay (drawer) — hidden off-canvas by default, slides in on .open */
.ixm-overlay{ position:fixed; top:0; right:0; width:360px; max-width:100vw; height:100vh; height:100dvh; background:#fff; z-index:9999; box-shadow:var(--ixm-shadow); transform:translateX(100%); visibility:hidden; transition:transform var(--ixm-speed) cubic-bezier(.22,.61,.36,1), visibility 0s linear var(--ixm-speed); overflow:hidden; }
.ixm-overlay.open{ transform:translateX(0); visibility:visible; transition:transform var(--ixm-speed) cubic-bezier(.22,.61,.36,1); }

/* sit below the WP admin bar so it doesn't cover the drawer's top row */
.admin-bar .ixm-overlay{ top:32px; height:calc(100vh - 32px); height:calc(100dvh - 32px); }
@media screen and (max-width:782px){ .admin-bar .ixm-overlay{ top:46px; height:calc(100vh - 46px); height:calc(100dvh - 46px); } }

/* track */
.ixm-track{ display:flex; width:300%; height:100%; transition:transform var(--ixm-speed) cubic-bezier(.22,.61,.36,1); will-change:transform; }
.ixm-panel{ width:100%; flex:0 0 33.3333%; height:100%; display:flex; flex-direction:column; background:var(--ixm-white); overflow:hidden; }

/* panel header */
.ixm-header{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--ixm-border); background:var(--ixm-white); flex-shrink:0; }
.ixm-header-title{ font-size:15px; font-weight:700; color:var(--ixm-text); }
.ixm-close{ width:34px; height:34px; border-radius:8px; border:1px solid var(--ixm-border); background:var(--ixm-bg); color:var(--ixm-text-mid); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s; }
.ixm-close:hover{ background:#fee2e2; border-color:#fca5a5; color:#dc2626; }
.ixm-back{ display:flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--ixm-purple); background:none; border:none; cursor:pointer; padding:6px 10px 6px 6px; border-radius:8px; transition:background .2s; }
.ixm-back:hover{ background:var(--ixm-purple-bg); }

/* main nav */
.ixm-nav{ flex:1; overflow-y:auto; padding:8px 12px; }
.ixm-nav-item{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:13px 12px; font-size:15px; font-weight:600; color:var(--ixm-text); text-decoration:none; border-radius:10px; background:none; border:none; cursor:pointer; transition:background .18s, color .18s; margin-bottom:2px; }
.ixm-nav-item:hover{ background:var(--ixm-purple-bg); color:var(--ixm-purple); }
.ixm-has-sub .ixm-arrow{ color:var(--ixm-text-light); transition:.2s; }
.ixm-nav-item:hover .ixm-arrow{ color:var(--ixm-purple); }

/* footer */
.ixm-footer{ padding:16px 16px 24px; border-top:1px solid var(--ixm-border); display:flex; flex-direction:column; gap:10px; flex-shrink:0; }
.ixm-cta{ display:block; text-align:center; padding:13px; background:var(--ixm-purple); color:#fff; font-size:14px; font-weight:700; border-radius:10px; text-decoration:none; transition:background .2s; }
.ixm-cta:hover{ background:var(--ixm-purple-lt); }
.ixm-signin{ display:block; text-align:center; padding:11px; border:1.5px solid var(--ixm-border); color:var(--ixm-text-mid); font-size:14px; font-weight:600; border-radius:10px; text-decoration:none; transition:.2s; }
.ixm-signin:hover{ border-color:var(--ixm-purple); color:var(--ixm-purple); background:var(--ixm-purple-bg); }

/* sub title */
.ixm-sub-title{ padding:14px 20px 12px; border-bottom:1px solid var(--ixm-border); background:#fafbff; flex-shrink:0; }
.ixm-sub-title strong{ display:block; font-size:14px; font-weight:700; color:var(--ixm-purple); margin-bottom:2px; }
.ixm-sub-title span{ font-size:12px; color:var(--ixm-text-light); }

/* sub body */
.ixm-sub-body{ flex:1; overflow-y:auto; padding:10px 12px; }

/* accordion */
.ixm-accordion{ border:1.5px solid var(--ixm-border); border-radius:10px; overflow:hidden; margin-bottom:8px; }
.ixm-accordion-trigger{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:12px 14px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ixm-text-mid); background:var(--ixm-bg); border:none; cursor:pointer; transition:background .18s, color .18s; }
.ixm-accordion-trigger:hover{ background:var(--ixm-purple-bg); color:var(--ixm-purple); }
.ixm-accordion-trigger.open{ color:var(--ixm-purple); background:var(--ixm-purple-bg); }
.ixm-acc-icon{ transition:transform .25s ease; flex-shrink:0; }
.ixm-accordion-trigger.open .ixm-acc-icon{ transform:rotate(180deg); }
.ixm-accordion-body{ max-height:0; overflow:hidden; background:var(--ixm-white); border-top:1px solid transparent; transition:max-height .38s ease, padding .25s ease, border-color .25s ease; padding:0 8px; }
.ixm-accordion-body.open{ max-height:700px; padding:6px 8px 8px; border-top:1px solid var(--ixm-border); }

/* sub items */
.ixm-sub-item{ display:flex; align-items:center; gap:12px; padding:9px 10px; text-decoration:none; color:var(--ixm-text); font-size:13.5px; font-weight:600; border-radius:8px; transition:background .18s, color .18s; margin-bottom:2px; }
.ixm-sub-item:hover{ background:var(--ixm-purple-bg); color:var(--ixm-purple); }
.ixm-sub-item:hover .ixm-sub-icon{ background:var(--ixm-purple); color:#fff; }
.ixm-sub-icon{ width:32px; height:32px; min-width:32px; border-radius:8px; background:var(--ixm-purple-icon); color:var(--ixm-purple); display:flex; align-items:center; justify-content:center; transition:.18s; }
.ixm-sub-icon svg{ width:16px; height:16px; }

/* sub footer */
.ixm-sub-footer{ border-top:1px solid var(--ixm-border); background:#f6f7fb; flex-shrink:0; }
.ixm-sub-footer-link{ display:flex; align-items:center; gap:12px; padding:12px 16px; text-decoration:none; border-bottom:1px solid var(--ixm-border); color:var(--ixm-text); transition:background .18s; }
.ixm-sub-footer-link:last-child{ border-bottom:none; }
.ixm-sub-footer-link:hover{ background:var(--ixm-purple-bg); }
.ixm-sub-footer-link svg{ color:var(--ixm-purple); flex-shrink:0; }
.ixm-sub-footer-link strong{ display:block; font-size:13px; color:var(--ixm-text); }
.ixm-sub-footer-link small{ font-size:11.5px; color:var(--ixm-text-light); }

@media (max-width:420px){ .ixm-overlay{ width:100vw; } }

/* drawer only drives mobile — hide the old dropdown nav on small screens */
@media (max-width:1024px){
	.ix-site-header .ix-nav{ display:none !important; }
}

/* ============================================================
   SERVICE PAGE family (.ix-srv-*) — a distinct look for SERVICE pages
   (Odoo Implementation etc.), separate from the industry components.
   Same theme tokens: purple #50269E, happy-font headings, AlmadenSans body,
   shared .ix-btn buttons + ix_badge eyebrows. No JS, no image slots.
   ============================================================ */

/* ---- 1) Service Hero (image + floating card) ---- */
/* All service heroes render as a Zoom-style rounded panel: a full-bleed white section with a
   contained, rounded, soft-purple gradient panel on the inner grid (.ix-srv-hero__grid). */
.ix-srv-hero{ padding:18px 18px 0; background:#fff; }
.ix-srv-hero__grid{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; background:radial-gradient(130% 135% at 80% 8%, #f5f2ff 0%, #eae3fc 48%, #d8ccf6 100%); border-radius:28px; padding:70px 56px; }
@media (max-width:640px){
	.ix-srv-hero{ padding:12px 12px 0; }
	.ix-srv-hero__grid{ padding:34px 22px; border-radius:22px; }
}
.ix-srv-hero__title{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:clamp(30px,3.2vw,42px); line-height:1.05; color:#000; margin:0 0 22px; text-wrap:balance; }   /* matched to .ix-ihero--svc: fluid + balanced wrap, 2026-08-19 */
.ix-srv-hero__sub{ font-family:'AlmadenSans para',Inter,sans-serif; color:var(--text-mid,#4a4f63); font-size:1.08rem; line-height:1.5; margin:0 0 26px; max-width:560px; }
/* Very narrow phones (a 300px foldable outer screen, for example): the title clamp()
   floor is 30px, and at 30px the single word Implementation measures 265px -- wider
   than the grid 220px content box. .ix-srv-hero__copy is a grid item with the default
   min-width:auto, so it could not shrink: the track blew out to 264.75px and the copy
   ran 5px past the viewport edge. min-width:0 lets the track match its container, and
   overflow-wrap then breaks the one word that still cannot fit. BOTH are needed --
   min-width:0 alone leaves a 265px line rendering inside a 220px column. Line count and
   height are unchanged (4 lines / 126px at 300px); desktop tracks are byte-identical.
   hyphens:auto was tried and does nothing here (no hyphenation dictionary). 2026-08-28. */
.ix-srv-hero__grid > *{ min-width:0; }
.ix-srv-hero__title{ overflow-wrap:break-word; }

.ix-srv-hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }
.ix-srv-hero__chips{ list-style:none; margin:30px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px 12px; }
.ix-srv-hero__chip{ display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px; background:#F6F6F6; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.92rem; font-weight:600; color:#1b1d2b; }
.ix-srv-hero__chipico{ display:inline-flex; width:18px; height:18px; border-radius:50%; background:#ECE6FF; color:#50269E; align-items:center; justify-content:center; }
/* right: photo with a floating "what's included" card overlapping its lower-left */
.ix-srv-hero__media{ position:relative; }
.ix-srv-hero__img{ width:100%; aspect-ratio:2.5/2; height:auto; object-fit:cover; object-position:center; border-radius:22px; display:block; box-shadow:0 24px 60px rgba(0,5,61,.16); }
.ix-srv-hero__card{ position:absolute; left:-40px; bottom:-40px; width:248px; max-width:72%; background:rgba(255,255,255,.97); backdrop-filter:blur(4px); border:1px solid #ECE6FF; border-radius:16px; padding:16px 18px; box-shadow:0 18px 44px rgba(0,5,61,.22); }
.ix-srv-hero__card-eyebrow{ display:block; font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color:#50269E; margin:0 0 12px; }
.ix-srv-hero__card-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.ix-srv-hero__card-list li{ display:flex; align-items:center; gap:10px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.9rem; line-height:1.3; color:#1b1d2b; }
.ix-srv-hero__check{ flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:#50269E; color:#fff; display:inline-flex; align-items:center; justify-content:center; }

/* ---- 2) Service Stats strip ---- */
/* White divider style (2026-08-14, owner) — restyled from the old purple gradient
   card to match the Support-page trust bar (.ix-sup-stats/.ix-pstat): clean white row,
   dark figure, muted label, thin vertical dividers. Content on every page is untouched;
   only the look changes. Shared by all service pages that use .ix-srv-stats. */
.ix-srv-stats{ padding:clamp(28px,4vw,46px) 24px; background:#fff; border-bottom:1px solid #efeaff; }
.ix-srv-stats__inner{ max-width:1120px; margin:0 auto; background:transparent; border:0; border-radius:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:16px 0; box-shadow:none; }
.ix-srv-stats__item{ text-align:center; padding:6px 24px; }
.ix-srv-stats__item:last-child{ border-right:0; } .ix-srv-stats__item + .ix-srv-stats__item{ position:relative; } .ix-srv-stats__item + .ix-srv-stats__item::before{ content:""; position:absolute; left:0; top:7px; bottom:7px; width:1px; background:#e6def8; }
.ix-srv-stats__num{ font-family:'index happy font',Inter,sans-serif; font-weight:800; font-size:1.95rem; line-height:1.1; letter-spacing:-.01em; color:#0d1224; margin-bottom:7px; }
.ix-srv-stats__label{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.8rem; font-weight:600; text-transform:none; letter-spacing:normal; line-height:1.45; color:#6c6491; }

/* ---- 3) Service Deliverables ---- */
.ix-srv-deliver{ padding:70px 24px; background:#f7f7fb; }
.ix-srv-deliver__head{ max-width:820px; margin:0 auto 46px; text-align:center; }
.ix-srv-deliver__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-srv-deliver__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:42px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-deliver__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.05rem; line-height:1.5; color:#3a3a4a; margin:0; }
.ix-srv-deliver__grid{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.ix-srv-deliver__card{ background:#fff; border:1px solid #ede9f7; border-radius:18px; padding:28px 24px; box-shadow:0 10px 30px rgba(13,18,36,.05); }
.ix-srv-deliver__ctitle{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:1.25rem; color:#50269E; margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid #efeaff; text-align:center; line-height:1.3; min-height:calc(2.6em + 14px); display:flex; align-items:flex-end; justify-content:center; }
.ix-srv-deliver__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
.ix-srv-deliver__list li{ display:flex; align-items:flex-start; gap:11px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.98rem; line-height:1.4; color:#1b1d2b; }
.ix-srv-deliver__check{ flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:#ECE6FF; color:#50269E; display:inline-flex; align-items:center; justify-content:center; margin-top:1px; }

/* ---- 4) Service Process (image-topped step cards) ---- */
.ix-srv-process{ padding:70px 24px; background:#fff; }
.ix-srv-process__head{ max-width:820px; margin:0 auto 50px; text-align:center; }
.ix-srv-process__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-srv-process__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:42px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-process__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.05rem; line-height:1.5; color:#3a3a4a; margin:0; }
.ix-srv-process__track{ max-width:1200px; margin:0 auto; list-style:none; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.ix-srv-process__step{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #ede9f7; border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(13,18,36,.06); }
.ix-srv-process__thumb{ position:relative; aspect-ratio:4/3; overflow:hidden; background:#ece9f5; }
.ix-srv-process__thumb img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.ix-srv-process__num{ position:absolute; top:12px; left:12px; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:12px; background:#50269E; color:#fff; font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:.98rem; box-shadow:0 8px 20px rgba(80,38,158,.35); }
.ix-srv-process__body{ padding:18px 18px 22px; }
.ix-srv-process__stitle{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:1.1rem; color:#16182b; margin:0 0 8px; }
/* ===== Service-process density fix 2026-08-05 =====
   The Customizer turns these steps into a sticky scroll-stack with min-height:460px per
   step. With 6-7 steps carrying ~20 words each that spent ~3,400px of scrolling per service
   page on ~150 words. The sticky effect is kept; only the dead vertical space is removed,
   so no copy and no keyword is touched. Selector is `html body` (0,1,2) so it outranks the
   Customizer's `body` rule (0,1,1) without !important and regardless of load order. */
html body .ix-srv-process__step{ min-height:330px; padding:56px 40px 34px; margin-bottom:20px; }
/* The Customizer makes each step position:sticky on desktop (the pinned scroll-stack where
   each step slides up and covers the previous one) but flips it to position:static on phones,
   which kills the effect AND lets the absolute "STEP"/number labels escape onto the section
   heading. The owner wants that SAME scroll-stack on mobile — so keep the steps sticky here
   too (sticky is also a containing block, so the labels stay inside each card, no heading
   overlap). `html body` (0,1,2) outranks the Customizer's `body .ix-srv-process__step`
   (0,1,1) without !important; top:70px clears the mobile header. */
@media (max-width:900px){ html body .ix-srv-process__step{ min-height:auto; position:sticky; top:70px; } }
.ix-srv-process__sdesc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.92rem; line-height:1.55; color:#5a5a6a; margin:0; }

/* ---- 4b) Service Why (media + text) ---- */
.ix-srv-why{ padding:70px 24px; background:#fff; }
.ix-srv-why__grid{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1.05fr; gap:56px; align-items:center; }
.ix-srv-why__media img{ width:100%; aspect-ratio:3/2; height:auto; object-fit:cover; object-position:center; border-radius:22px; display:block; box-shadow:0 20px 50px rgba(0,5,61,.14); }
.ix-srv-why__eyebrow{ display:flex; margin:0 0 14px; }
.ix-srv-why__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:38px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-why__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.04rem; line-height:1.5; color:#3a3a4a; margin:0 0 24px; }
.ix-srv-why__list{ list-style:none; margin:0 0 30px; padding:0; display:flex; flex-direction:column; gap:18px; }
.ix-srv-why__item{ display:flex; gap:14px; align-items:flex-start; }
.ix-srv-why__check{ flex:0 0 26px; width:26px; height:26px; border-radius:50%; background:#ECE6FF; color:#50269E; display:flex; align-items:center; justify-content:center; margin-top:1px; }
.ix-srv-why__itemcopy strong{ display:block; font-family:'index happy font',Inter,sans-serif; font-size:1.05rem; font-weight:600; color:#16182b; margin-bottom:3px; }
.ix-srv-why__itemcopy span{ display:block; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.96rem; line-height:1.55; color:#5a5a6a; }

/* ---- 4c) Service Modules (chip grid) ---- */
.ix-srv-mods{ padding:70px 24px; background:#f7f7fb; }
.ix-srv-mods__head{ max-width:820px; margin:0 auto 34px; text-align:center; }
.ix-srv-mods__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-srv-mods__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:38px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-mods__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.05rem; line-height:1.5; color:#3a3a4a; margin:0; }
.ix-srv-mods__grid{ max-width:1000px; margin:0 auto; list-style:none; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.ix-srv-mods__chip{ display:inline-flex; align-items:center; gap:9px; padding:11px 18px; border-radius:999px; background:#fff; border:1px solid #e7e2f3; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.96rem; font-weight:600; color:#1b1d2b; box-shadow:0 4px 14px rgba(13,18,36,.04); transition:border-color .15s ease, box-shadow .15s ease; }
.ix-srv-mods__chip:hover{ border-color:#c9b8f0; box-shadow:0 8px 20px rgba(80,38,158,.10); }
.ix-srv-mods__dot{ width:8px; height:8px; border-radius:50%; background:#50269E; flex:0 0 auto; }
.ix-srv-mods__ico{ width:26px; height:26px; min-width:26px; border-radius:6px; flex:0 0 auto; display:block; object-fit:contain; }
.ix-srv-mods__chip{ padding-left:10px; }
@media (max-width:560px){ .ix-srv-mods__title{ font-size:1.7rem; } }

/* Chip row on phones (owner request 2026-08-28: adjust this in mobile view). The chips
   run 147-230px wide, so in a 339px container at 375px only the two narrowest ever
   paired up -- 11 rows for 12 chips and 670px of height, with a ragged centred zigzag.
   Tightening the type and gap gets most chips under half the container instead:
   370px / 7 rows at 375, and a clean 6 rows of 2 at 430. Chosen over a forced 2-column
   grid, which packs to 366px but wraps four of the longer labels onto a second line and
   leaves chip heights uneven (48-62px); this keeps every chip a uniform 46px and the
   pill shape unchanged. Below ~340px two chips cannot fit at any readable size, so
   300-320 only gain the shorter chip. Desktop is untouched (1440 still 3 rows / 169px). */
@media (max-width:600px){
	.ix-srv-mods__grid{ gap:8px; }
	.ix-srv-mods__chip{ font-size:13px; padding:9px 12px 9px 8px; }
}

/* ---- 4d) Service Platform migrations (card grid — e.g. QuickBooks → Odoo) ---- */
.ix-srv-plat{ padding:70px 24px; background:#fff; }
.ix-srv-plat__head{ max-width:820px; margin:0 auto 40px; text-align:center; }
.ix-srv-plat__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-srv-plat__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:42px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-plat__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.05rem; line-height:1.5; color:#3a3a4a; margin:0; }
.ix-srv-plat__grid{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.ix-srv-plat__card{ background:#fff; border:1px solid #ede9f7; border-radius:16px; padding:24px 24px 26px; box-shadow:0 10px 30px rgba(13,18,36,.05); transition:border-color .15s ease, box-shadow .15s ease; }
.ix-srv-plat__card:hover{ border-color:#c9b8f0; box-shadow:0 16px 36px rgba(80,38,158,.10); }
.ix-srv-plat__from{ display:flex; align-items:center; gap:9px; font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:1.2rem; color:#0d1224; margin-bottom:10px; }
.ix-srv-plat__arrow{ display:inline-flex; color:#50269E; }
.ix-srv-plat__to{ color:#50269E; }
.ix-srv-plat__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.96rem; line-height:1.55; color:#5a5a6a; margin:0; }
@media (max-width:860px){ .ix-srv-plat{ padding:40px 18px; } .ix-srv-plat__grid{ grid-template-columns:repeat(2,1fr); } .ix-srv-plat__title{ font-size:1.9rem; } }
@media (max-width:560px){ .ix-srv-plat{ padding:30px 18px; } .ix-srv-plat__grid{ grid-template-columns:1fr; } .ix-srv-plat__title{ font-size:1.7rem; } }

/* ---- 5) Service Packages (3 tiers) ---- */
.ix-srv-pack{ padding:70px 24px; background:#f7f7fb; }
.ix-srv-pack__head{ max-width:820px; margin:0 auto 50px; text-align:center; }
.ix-srv-pack__eyebrow{ display:flex; justify-content:center; margin:0 0 14px; }
.ix-srv-pack__title{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:42px; line-height:1.18; color:#0d1224; margin:0 0 14px; }
.ix-srv-pack__sub{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:1.05rem; line-height:1.5; color:#3a3a4a; margin:0; }
.ix-srv-pack__grid{ max-width:1140px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; align-items:stretch; }
.ix-srv-pack__card{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #ebe7f6; border-radius:20px; padding:34px 28px; box-shadow:0 12px 34px rgba(13,18,36,.06); }
.ix-srv-pack__card--popular{ border:2px solid #50269E; box-shadow:0 26px 60px rgba(80,38,158,.18); }
.ix-srv-pack__badge{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:#50269E; color:#fff; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:.78rem; letter-spacing:.02em; padding:6px 16px; border-radius:999px; white-space:nowrap; }
.ix-srv-pack__name{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:1.5rem; color:#0d1224; margin:0 0 4px; }
.ix-srv-pack__tagline{ font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:1rem; color:#50269E; margin:0 0 10px; }
.ix-srv-pack__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.96rem; line-height:1.5; color:#5a5a6a; margin:0 0 22px; padding-bottom:22px; border-bottom:1px solid #efeaff; }
.ix-srv-pack__list{ list-style:none; margin:0 0 26px; padding:0; display:flex; flex-direction:column; gap:13px; flex:1 1 auto; }
.ix-srv-pack__list li{ display:flex; align-items:flex-start; gap:11px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.98rem; line-height:1.45; color:#1b1d2b; }
.ix-srv-pack__check{ flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:#ECE6FF; color:#50269E; display:inline-flex; align-items:center; justify-content:center; margin-top:2px; }
.ix-srv-pack__cta{ width:100%; }

/* ---- Service family responsive ---- */
/* Tablet (≤1000): shrink the hero title before the 2-col hero gets too narrow,
   tighten 2-col grids, and keep the 3-up packages from overflowing. */
@media (max-width:1000px){
	.ix-srv-hero__grid{ gap:40px; }
	.ix-srv-why__grid{ gap:40px; }
	.ix-srv-deliver__grid{ grid-template-columns:repeat(2,1fr); }
	.ix-srv-process__track{ grid-template-columns:repeat(2,1fr); gap:32px 24px; }
	.ix-srv-process__step:not(:last-child)::after{ display:none; }
	.ix-srv-pack__grid{ gap:18px; }
	.ix-srv-pack__card{ padding:30px 22px; }
}
/* Stacking point (≤860): all 2-col sections go single column, incl. the hero,
   the WHY section (previously never collapsed — the core bug), and packages. */
@media (max-width:860px){
	.ix-srv-hero{ padding:40px 18px; }
	.ix-srv-hero__grid{ grid-template-columns:1fr; gap:32px; }
	.ix-srv-stats__inner{ grid-template-columns:repeat(2,1fr); gap:20px 12px; }
	.ix-srv-stats__item:nth-child(2){ border-right:0; }
	.ix-srv-deliver,.ix-srv-mods,.ix-srv-process,.ix-srv-why,.ix-srv-pack{ padding:40px 18px; }
	.ix-srv-deliver__title,.ix-srv-process__title,.ix-srv-pack__title{ font-size:1.9rem; }
	.ix-srv-why__grid{ grid-template-columns:1fr; gap:30px; }
	.ix-srv-why__title{ font-size:1.9rem; }
	.ix-srv-pack__grid{ grid-template-columns:1fr; max-width:420px; }
	.ix-srv-pack__card{ padding:34px 28px; }
	.ix-srv-pack__card--popular{ order:-1; }
}
/* Phone (≤560): single-column everything; long section titles trimmed; the hero
   "What's included" card drops below the image (instead of overlapping it). */
@media (max-width:560px){
	.ix-srv-hero,.ix-srv-deliver,.ix-srv-mods,.ix-srv-process,.ix-srv-why,.ix-srv-pack{ padding:30px 18px; }
	.ix-srv-hero__card{ position:static; width:auto; max-width:none; left:auto; bottom:auto; margin-top:14px; }
	.ix-srv-deliver__grid{ grid-template-columns:1fr; }
	.ix-srv-deliver__title,.ix-srv-process__title,.ix-srv-pack__title,.ix-srv-plat__title,.ix-srv-why__title{ font-size:1.6rem; }
	.ix-srv-process__track{ grid-template-columns:1fr; }
	.ix-srv-stats__inner{ grid-template-columns:1fr; }
	.ix-srv-stats__item{ border-right:0; border-bottom:1px solid #ece7f7; padding-bottom:16px; }
	.ix-srv-stats__item:last-child{ border-bottom:0; padding-bottom:4px; }
	.ix-srv-stats__num{ font-size:1.8rem; }
}
/* Small phones (≤400): keep the big happy-font headings from overflowing. */
@media (max-width:400px){
	.ix-srv-deliver__title,.ix-srv-process__title,.ix-srv-pack__title,.ix-srv-plat__title,.ix-srv-why__title,.ix-srv-mods__title{ font-size:1.45rem; }
}

/* ===================================================================
   BASE mobile hero for ALL service/Odoo pages, 2026-08-15 (Option A).
   Lifted out of the page-362 scope so every page using .ix-srv-hero gets
   the same mobile treatment — no per-page redo. CTAs sit on one row as
   EQUAL HALVES (flex:1) so it works for any label length (short like
   "Book a Demo" or long like "Book a Free Consultation", which just wraps
   inside its half). Image is taller and the "What's Included" card is
   pulled up to overlap it; on the "why an expert" (.ix-srv-deliver--wx) card
   only the card HEADING is centred — the tick rows stay flush-left so the
   check icons line up in a column (they were centred per-row, which made the
   ticks ragged; fixed 2026-08-15). Applies to every service page sharing
   these components.
   =================================================================== */
@media (max-width:560px){
	.ix-srv-hero__actions{ flex-direction:row; flex-wrap:nowrap; gap:10px; }
	.ix-srv-hero__actions .ix-btn{ flex:1 1 0; min-width:0; padding:13px 14px; font-size:14px; line-height:1.2; justify-content:center; text-align:center; }
	.ix-srv-hero__img{ aspect-ratio:4/3; }
	.ix-srv-hero__card{ position:relative; z-index:2; margin:-42px auto 0; width:auto; max-width:86%; padding:14px 16px; }
	.ix-srv-hero__card-eyebrow{ font-size:.7rem; margin-bottom:8px; }
	.ix-srv-hero__card-list{ gap:7px; }
	.ix-srv-hero__card-list li{ font-size:.78rem; line-height:1.2; }
	.ix-srv-hero__check{ width:18px; height:18px; }
	.ix-srv-deliver--wx .ix-srv-deliver__card h3{ text-align:center; }
	.ix-srv-deliver--wx .ix-srv-deliver__list{ list-style:none; padding-left:0; }
	.ix-srv-deliver--wx .ix-srv-deliver__list li{ display:flex; justify-content:flex-start; align-items:flex-start; gap:10px; text-align:left; }
}

/* ============================================================
   Consistent section rhythm — 140 / 80 / 60 px gaps between sections
   (70 / 40 / 30 px vertical padding per side) across the industry + shared
   section families, matching the service pages. Vertical-only, so each
   section keeps its own horizontal padding (e.g. .ix-ftabs uses 48px).
   The hero (.ix-ihero) is intentionally excluded — its top padding is
   calibrated for the fixed-header overlay tuck (margin-top:-88px).
   ============================================================ */
.ix-iccar, .ix-iwhat, .ix-ichal, .ix-ftabs, .ix-services, .ix-ihow, .ix-ifaq, .ix-ctap, .ix-trusted{ padding-top:70px; padding-bottom:70px; }
@media (max-width:860px){
	.ix-iccar, .ix-iwhat, .ix-ichal, .ix-ftabs, .ix-services, .ix-ihow, .ix-ifaq, .ix-ctap, .ix-trusted{ padding-top:40px; padding-bottom:40px; }
}
@media (max-width:560px){
	.ix-iccar, .ix-iwhat, .ix-ichal, .ix-ftabs, .ix-services, .ix-ihow, .ix-ifaq, .ix-ctap, .ix-trusted{ padding-top:30px; padding-bottom:30px; }
}

/* Industry hero (.ix-ihero): drop the -88px header tuck so the top padding is
   the REAL gap below the fixed header. main already offsets the 88px header, so
   padding-top = the visible header→hero gap: 80 / 60 / 40 px. Bottom padding =
   70/40/30 so the gap to the first section matches the section rhythm.
   Home hero (.ix-hero) keeps its tuck — untouched. */
.wp-site-blocks main > .ix-ihero{ margin-top:0; }
.ix-ihero{ padding-top:60px; padding-bottom:70px; }
@media (max-width:860px){ .ix-ihero{ padding-top:60px; padding-bottom:40px; } }
@media (max-width:560px){ .ix-ihero{ padding-top:40px; padding-bottom:30px; } }
.ix-rating__logo{
	filter:none !important;
	-webkit-filter:none !important;
}

/* ============================================================================
   Baked-page icon fallbacks (added 2026-06-29)
   MCP/baked industry pages store rendered HTML; WordPress KSES strips inline
   <svg> on save, so every section icon span renders empty. These rules draw the
   icon as a background-image ONLY when the holder is :empty, so pattern-ref
   pages (with real inline SVG) are untouched. Colours are baked in (currentColor
   doesn't apply to CSS background SVGs). Mirrors the inline SVGs in
   patterns/{steps-timeline,faq,icon-cards}.php.
   ============================================================================ */
.ix-iccar__abtn--prev:not(:has(svg)){ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%23060038'%20stroke-width%3D'2.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M19%2012H5M11%206l-6%206%206%206'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:20px 20px; }
.ix-iccar__abtn--next:not(:has(svg)){ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%23060038'%20stroke-width%3D'2.2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M5%2012h14M13%206l6%206-6%206'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:20px 20px; }
.ix-ihow__check:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'2.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%206%209%2017l-5-5'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:15px 15px; }
.ix-ifaq__ico:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20448%20512'%20fill%3D'%2350269E'%3E%3Cpath%20d%3D'M416%20208H272V64c0-17.7-14.3-32-32-32h-32c-17.7%200-32%2014.3-32%2032v144H32c-17.7%200-32%2014.3-32%2032v32c0%2017.7%2014.3%2032%2032%2032h144v144c0%2017.7%2014.3%2032%2032%2032h32c17.7%200%2032-14.3%2032-32V304h144c17.7%200%2032-14.3%2032-32v-32c0-17.7-14.3-32-32-32z'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:14px 14px; transition:transform .3s ease; }
.ix-ifaq__item.is-open .ix-ifaq__ico:empty{ transform:rotate(45deg); }
.ix-ichal__icon:empty{ background-position:center; background-repeat:no-repeat; background-size:72px 72px; }
.ix-ichal__card:nth-child(1) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M12%203l7%203v5c0%204.2-3%207.3-7%208.9-4-1.6-7-4.7-7-8.9V6l7-3z'%2F%3E%3Cpath%20d%3D'M9%2012l2%202%204-4'%2F%3E%3C%2Fsvg%3E"); }
.ix-ichal__card:nth-child(2) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M12%2022V11'%2F%3E%3Cpath%20d%3D'M12%2013C12%208.6%208.4%205%204%205c0%204.4%203.6%208%208%208z'%2F%3E%3Cpath%20d%3D'M12%2011c0-3.3%202.7-6%206-6%200%203.3-2.7%206-6%206z'%2F%3E%3C%2Fsvg%3E"); }
.ix-ichal__card:nth-child(3) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M3%207.5l9-4%209%204v9l-9%204-9-4z'%2F%3E%3Cpath%20d%3D'M3%207.5l9%204%209-4M12%2011.5v9'%2F%3E%3C%2Fsvg%3E"); }
.ix-ichal__card:nth-child(4) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M6%202.5h12v19l-3-2-3%202-3-2-3%202z'%2F%3E%3Cpath%20d%3D'M9%207.5h6M9%2011h6M12%2014v3'%2F%3E%3C%2Fsvg%3E"); }
.ix-ichal__card:nth-child(5) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M4%209.5l1.4-5h13.2L20%209.5M5%209.5v10h14v-10M5%209.5h14'%2F%3E%3Cpath%20d%3D'M10%2019.5v-5h4v5'%2F%3E%3C%2Fsvg%3E"); }
.ix-ichal__card:nth-child(6) .ix-ichal__icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%2350269E'%20stroke-width%3D'1.4'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M4%2020h16'%2F%3E%3Cpath%20d%3D'M7%2020v-6M12%2020V7M17%2020v-9'%2F%3E%3C%2Fsvg%3E"); }

/* Service Tabs / Key Benefits row arrows (↗) + Feature Tabs item checks — same baked-page fix */
.ix-svc__arrow:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'%230d1224'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M7%2017%2017%207M8%207h9v9'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:13px 13px; }
.prod-icon:empty{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'%23fff'%3E%3Cpath%20d%3D'M9%2016.2%204.8%2012l-1.4%201.4L9%2019%2021%207l-1.4-1.4z'%2F%3E%3C%2Fsvg%3E"); background-position:center; background-repeat:no-repeat; background-size:18px 18px; }

/* ── Trusted Platforms ("Trusted by Our Clients") — review-platform cards ──
   patterns/trusted-platforms.php. Light section + 4 white cards (logo badge +
   name + blurb + "View Reviews" pill). Logos served from the Media Library. */
.ix-trustp { background:#f4f5f9; padding:64px 24px; }
.ix-trustp__head { text-align:center; max-width:680px; margin:0 auto 40px; }
.ix-trustp__title { font-family:'index happy font'; font-size:40px; line-height:1.15; color:var(--text-dark); margin:0 0 12px; }
.ix-trustp__sub { font-family:'AlmadenSans para'; font-size:16px; color:var(--text-mid); margin:0; }
.ix-trustp__grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; max-width:1200px; margin:0 auto; }
.ix-trustp__card { background:var(--white); border-radius:20px; padding:36px 24px; text-align:center; box-shadow:0 10px 30px rgba(13,18,36,.06); display:flex; flex-direction:column; align-items:center; }
.ix-trustp__badge { width:88px; height:88px; border-radius:50%; background:#eef0f6; display:flex; align-items:center; justify-content:center; margin-bottom:20px; }
.ix-trustp__badge.is-dark { background:#161616; }
.ix-trustp__badge img { width:44px; height:44px; object-fit:contain; display:block; }
.ix-trustp__name { font-family:'index happy font'; font-size:20px; color:var(--text-dark); margin:0 0 10px; }
.ix-trustp__desc { font-family:'AlmadenSans para'; font-size:14px; line-height:1.5; color:var(--text-mid); margin:0 0 22px; flex:1; }
.ix-trustp__btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; font-weight:600; line-height:1; min-height:46px; color:#0a0a14; background:#ECE6FF; border:0; border-radius:12px; padding:0 20px; text-decoration:none; transition:background .15s ease, gap .18s ease; }
.ix-trustp__btn:hover { background:#ddd2ff; gap:10px; }
@media (max-width:1000px){ .ix-trustp__grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .ix-trustp { padding:48px 18px; } .ix-trustp__grid { grid-template-columns:1fr; } .ix-trustp__title { font-size:30px; } }

/* "Why hire an expert" — 3-col variant of the deliverables cards (6 reason cards) */
.ix-srv-deliver--wx .ix-srv-deliver__grid{ grid-template-columns:repeat(3,1fr); }
@media (max-width:1000px){ .ix-srv-deliver--wx .ix-srv-deliver__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .ix-srv-deliver--wx .ix-srv-deliver__grid{ grid-template-columns:1fr; } }

/* ============ IW motion layer (2026-07-14) — tasteful, reduced-motion aware ============ */
@keyframes ixFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ix-dropdown-row.open .ix-panel.active{animation:ixFadeUp .26s ease both}
.ix-svc-group.active .ix-item{animation:ixFadeUp .32s cubic-bezier(.22,.61,.36,1) both}
.ix-svc-group.active .ix-item:nth-child(2){animation-delay:30ms}
.ix-svc-group.active .ix-item:nth-child(3){animation-delay:60ms}
.ix-svc-group.active .ix-item:nth-child(4){animation-delay:90ms}
.ix-svc-group.active .ix-item:nth-child(5){animation-delay:120ms}
.ix-svc-group.active .ix-item:nth-child(6){animation-delay:150ms}
.ix-svc-group.active .ix-item:nth-child(7){animation-delay:180ms}
.ix-svc-group.active .ix-item:nth-child(8){animation-delay:210ms}
.ix-svc-group.active .ix-item:nth-child(9){animation-delay:240ms}
.ix-svc-group.active .ix-item:nth-child(10){animation-delay:270ms}
.ix-svc__panel.active{animation:ixFadeUp .3s ease both}
html.ix-rvl .ix-rv{opacity:0;transform:translateY(14px);transition:opacity .5s cubic-bezier(.22,.61,.36,1),transform .5s cubic-bezier(.22,.61,.36,1)}
html.ix-rvl .ix-rv.ix-in{opacity:1;transform:none}
.ix-srv-deliver__card,.ix-srv-plat__card{transition:transform .32s ease,box-shadow .32s ease}
.ix-srv-deliver__card:hover,.ix-srv-plat__card:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(80,38,158,.12)}
@media (prefers-reduced-motion:reduce){.ix-dropdown-row.open .ix-panel.active,.ix-svc-group.active .ix-item,.ix-svc__panel.active{animation:none}html.ix-rvl .ix-rv{opacity:1;transform:none;transition:none}}

/* ============ Trust Deck (ix-proofdeck) — proof chips + stack marquee + rotating capsule (2026-07-16; placed after case-studies) ============ */
.ix-trustdeck-wrap{ padding:22px 24px 30px; background:#fff; overflow-x:clip; }
.ix-proofdeck{ max-width:1060px; margin:0 auto; font-family:var(--wp--preset--font-family--body); }
.ix-proofdeck__chips{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.ix-proofdeck__chip{ position:relative; display:flex; align-items:center; gap:7px; background:#fff; border:1px solid #e9e4f7; border-radius:999px; padding:7px 13px; overflow:hidden; box-shadow:0 6px 18px -12px rgba(13,18,36,.3); transition:transform .22s, box-shadow .22s; cursor:default; white-space:nowrap; text-decoration:none; color:var(--text-dark); }
.ix-proofdeck__chip:hover{ transform:translateY(-2px); box-shadow:0 14px 26px -12px rgba(80,38,158,.4); }
.ix-proofdeck__chip::after{ content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(107,63,196,.12) 50%,transparent 70%); transform:translateX(-100%); animation:ixSheen 5.5s ease-in-out infinite; }
.ix-proofdeck__chip:nth-child(2)::after{ animation-delay:1.1s; }
.ix-proofdeck__chip:nth-child(3)::after{ animation-delay:2.2s; }
.ix-proofdeck__chip:nth-child(4)::after{ animation-delay:3.3s; }
.ix-proofdeck__chip:nth-child(5)::after{ animation-delay:4.4s; }
@keyframes ixSheen{ 0%,55%{transform:translateX(-100%)} 85%,100%{transform:translateX(100%)} }
.ix-proofdeck__chip--verify{ cursor:pointer; border:double 2px transparent; background-image:linear-gradient(#fff,#fff),linear-gradient(120deg,var(--purple),#CC3366,var(--purple-lt)); background-origin:border-box; background-clip:padding-box,border-box; }
.ix-proofdeck__arr{ font-size:11px; color:var(--purple); opacity:.7; }
.ix-proofdeck__ico{ flex:none; width:22px; height:22px; border-radius:7px; background:var(--purple-bg); display:flex; align-items:center; justify-content:center; color:var(--purple); }
.ix-proofdeck__ico svg{ width:12px; height:12px; fill:currentColor; }
.ix-proofdeck__ico b{ font-size:9px; font-weight:800; font-family:var(--wp--preset--font-family--heading); }
.ix-proofdeck__ico--pct{ font-size:8.5px; font-weight:800; font-family:var(--wp--preset--font-family--heading); }
.ix-proofdeck__ico--tick{ background:var(--purple); color:#fff; }
.ix-proofdeck__chip > b{ font-family:var(--wp--preset--font-family--heading); font-size:12px; font-weight:600; }
.ix-proofdeck__chip small{ font-size:10.5px; color:var(--text-mid); }
.ix-proofdeck__pill{ display:flex; align-items:center; height:58px; background:rgba(255,255,255,.88); backdrop-filter:blur(10px); border:1px solid #e9e4f7; border-radius:999px; padding:0 7px 0 20px; box-shadow:0 12px 30px -18px rgba(80,38,158,.3); }
.ix-proofdeck__label{ font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-mid); font-weight:700; white-space:nowrap; margin-right:18px; }
.ix-proofdeck__mq{ flex:1; min-width:0; position:relative; overflow:hidden; padding:0 6px; }
.ix-proofdeck__mq::before,.ix-proofdeck__mq::after{ content:""; position:absolute; top:0; bottom:0; width:64px; z-index:2; pointer-events:none; }
.ix-proofdeck__mq::before{ left:0; background:linear-gradient(90deg,rgba(255,255,255,.97),transparent); }
.ix-proofdeck__mq::after{ right:0; background:linear-gradient(-90deg,rgba(255,255,255,.97),transparent); }
.ix-proofdeck__track{ display:flex; align-items:center; gap:50px; width:max-content; animation:ixMqScroll 30s linear infinite; }
.ix-proofdeck__mq:hover .ix-proofdeck__track{ animation-play-state:paused; }
@keyframes ixMqScroll{ to{ transform:translateX(-50%); } }
.ix-proofdeck__logo{ height:23px; width:auto; display:block; opacity:.68; transition:.3s; }
.ix-proofdeck__logo:hover{ opacity:1; transform:translateY(-1px); }
.ix-proofdeck__logo--tall{ height:27px; }
.ix-proofdeck__logo--short{ height:17px; }
.ix-proofdeck__cap{ flex:none; position:relative; display:flex; align-items:center; margin-left:16px; padding:0 18px; background:linear-gradient(135deg,rgba(80,38,158,.95),rgba(107,63,196,.88)); border:1px solid rgba(255,255,255,.28); border-radius:999px; color:#fff; white-space:nowrap; min-width:240px; height:44px; overflow:hidden; box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 8px 20px -12px rgba(80,38,158,.5); }
.ix-proofdeck__capitem{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:7px; font-size:12px; font-weight:600; opacity:0; transform:translateY(8px); animation:ixCapcycle 12s infinite; }
.ix-proofdeck__capitem:nth-child(2){ animation-delay:4s; }
.ix-proofdeck__capitem:nth-child(3){ animation-delay:8s; }
@keyframes ixCapcycle{ 0%,2%{opacity:0;transform:translateY(8px)} 6%,29%{opacity:1;transform:none} 33%,100%{opacity:0;transform:translateY(-8px)} }
.ix-proofdeck__capstars{ color:#FFD166; letter-spacing:1.2px; font-size:11px; animation:ixStarpulse 2.4s ease-in-out infinite; }
@keyframes ixStarpulse{ 50%{ text-shadow:0 0 8px rgba(255,209,102,.8); } }
.ix-proofdeck--compact .ix-proofdeck__chips{ display:none; }
@media (max-width:880px){
	.ix-proofdeck__chips{ flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:4px 2px 8px; margin-bottom:6px; }
	.ix-proofdeck__chips::-webkit-scrollbar{ display:none; }
	.ix-proofdeck__chip{ flex:none; }
	.ix-proofdeck__pill{ height:auto; flex-wrap:wrap; border-radius:var(--radius-lg); padding:12px; gap:10px; }
	.ix-proofdeck__label{ margin-right:0; flex-basis:100%; text-align:center; }
	.ix-proofdeck__cap{ margin-left:0; flex:1 1 100%; min-width:0; }
	.ix-proofdeck__mq{ flex-basis:100%; order:3; }
	.ix-proofdeck__chip small{ display:none; }
}
@media (prefers-reduced-motion:reduce){
	.ix-proofdeck__chip::after,.ix-proofdeck__capstars{ animation:none; }
	.ix-proofdeck__track{ animation:none; }
	.ix-proofdeck__capitem{ animation:none; position:static; opacity:1; transform:none; }
	.ix-proofdeck__capitem:nth-child(n+2){ display:none; }
	.ix-proofdeck__chip:hover{ transform:none; }
}

/* ============ What We Do (ix-wwd) — showcase bento (2026-07-16; Odoo tile 2x1 + pricing tile = clean 4x2 grid) ============ */
.ix-wwd-wrap{ padding:56px 24px 64px; background:linear-gradient(180deg,#fff,#f7f5fc); overflow-x:clip; }
.ix-wwd{ max-width:1140px; margin:0 auto; font-family:var(--wp--preset--font-family--body); }
.ix-wwd__head{ text-align:center; max-width:660px; margin:0 auto 34px; }
.ix-wwd__head h2{ font-family:var(--wp--preset--font-family--heading); font-size:36px; line-height:1.12; margin:0 0 10px; letter-spacing:-.01em; color:var(--text-dark); }
.ix-wwd__head h2 em{ font-style:normal; background:linear-gradient(120deg,var(--purple),var(--purple-lt)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ix-wwd__head p{ color:var(--text-mid); font-size:15px; margin:0; }
.ix-wwd__grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:minmax(190px,auto); gap:16px; }
.ix-wwd__tile{ position:relative; background:#fff; border:1px solid #e9e4f7; border-radius:var(--radius-lg); padding:24px; overflow:hidden; display:flex; flex-direction:column; transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.ix-wwd__tile:hover{ transform:perspective(900px) rotateX(1.4deg) rotateY(-1.4deg) translateY(-5px); box-shadow:0 30px 54px -26px rgba(80,38,158,.42); }
.ix-wwd__tile::before{ content:""; position:absolute; width:220px; height:220px; border-radius:50%; right:-70px; top:-70px; background:radial-gradient(circle,rgba(107,63,196,.14),transparent 65%); opacity:0; transition:opacity .35s; }
.ix-wwd__tile:hover::before{ opacity:1; }
.ix-wwd__num{ position:absolute; right:18px; bottom:6px; font-family:var(--wp--preset--font-family--heading); font-weight:800; font-size:64px; line-height:1; color:rgba(80,38,158,.06); pointer-events:none; user-select:none; }
.ix-wwd__ico{ width:40px; height:40px; border-radius:11px; background:var(--purple-bg); color:var(--purple); display:flex; align-items:center; justify-content:center; margin-bottom:12px; flex:none; }
.ix-wwd__ico svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ix-wwd__tile h3{ font-family:var(--wp--preset--font-family--heading); font-size:17.5px; margin:0 0 4px; color:var(--text-dark); }
.ix-wwd__tile p{ font-size:12.5px; color:var(--text-mid); margin:0 0 10px; }
.ix-wwd__links{ display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; }
.ix-wwd__links a{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:12px; font-weight:600; line-height:1; color:var(--purple); background:#fff; border:1px solid #e5dcf9; border-radius:12px; padding:7px 12px; display:inline-flex; align-items:center; text-decoration:none; transition:.2s; }
.ix-wwd__links a:hover{ background:var(--purple); color:#fff; border-color:var(--purple); }
.ix-wwd__proof{ display:flex; align-items:center; gap:7px; font-size:11px; color:var(--text-mid); margin-top:10px; opacity:.85; }
.ix-wwd__dot{ width:6px; height:6px; border-radius:50%; background:#22c55e; flex:none; }
.ix-wwd__tile--odoo{ grid-column:span 2; background:linear-gradient(150deg,#3b1c77 0%,var(--purple) 55%,var(--purple-lt) 120%); border:none; color:#fff; padding:26px; }
.ix-wwd__tile--odoo::before{ background:radial-gradient(circle,rgba(255,255,255,.16),transparent 65%); opacity:1; width:320px; height:320px; }
.ix-wwd__tile--odoo .ix-wwd__num{ color:rgba(255,255,255,.07); }
.ix-wwd__tile--odoo .ix-wwd__ico{ background:rgba(255,255,255,.14); color:#fff; }
.ix-wwd__tile--odoo h3{ font-size:22px; color:#fff; }
.ix-wwd__tile--odoo p{ color:rgba(255,255,255,.82); font-size:13px; max-width:460px; }
.ix-wwd__tile--odoo .ix-wwd__links a{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.24); color:#fff; }
.ix-wwd__tile--odoo .ix-wwd__links a:hover{ background:#fff; color:var(--purple); }
.ix-wwd__tile--odoo .ix-wwd__proof{ color:rgba(255,255,255,.8); }
.ix-wwd__stats{ display:flex; gap:18px; margin:10px 0 12px; }
.ix-wwd__stats div b{ display:block; font-family:var(--wp--preset--font-family--heading); font-size:18px; color:#fff; line-height:1.1; }
.ix-wwd__stats div small{ font-size:10.5px; color:rgba(255,255,255,.7); letter-spacing:.03em; }
.ix-wwd__tile--wide{ grid-column:span 2; }

.ix-wwd__cta{ text-align:center; margin-top:22px; }
.ix-wwd__cta a{ display:inline-flex; align-items:center; justify-content:center; position:relative; overflow:hidden; background:var(--purple); color:#fff; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:16px; line-height:1; min-height:54px; padding:0 28px; border-radius:12px; text-decoration:none; transition:transform .2s; box-shadow:0 14px 30px -14px rgba(80,38,158,.6); }
.ix-wwd__cta a:hover{ transform:translateY(-2px); }
.ix-wwd__cta a::after{ content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%); transform:translateX(-120%); animation:ixSheen 3.4s ease-in-out infinite; }
.ix-wwd__cta small{ display:block; margin-top:9px; color:var(--text-mid); font-size:12px; }
@media (max-width:960px){
	.ix-wwd__grid{ grid-template-columns:1fr 1fr; grid-auto-rows:auto; }
	.ix-wwd__tile--odoo,.ix-wwd__tile--wide{ grid-column:span 2; }
}
@media (max-width:560px){
	.ix-wwd-wrap{ padding:44px 18px 52px; }
	.ix-wwd__head h2{ font-size:28px; }
	.ix-wwd__grid{ grid-template-columns:1fr; gap:12px; }
	.ix-wwd__tile--odoo,.ix-wwd__tile--wide{ grid-column:span 1; }
	.ix-wwd__stats{ flex-wrap:wrap; gap:12px 20px; }
	.ix-wwd__cta a{ display:flex; width:100%; min-height:50px; font-size:14px; padding:0 10px; }
}
@media (prefers-reduced-motion:reduce){
	.ix-wwd__tile,.ix-wwd__tile:hover{ transform:none; }
	.ix-wwd__cta a::after{ animation:none; }
	.ix-wwd__cta a:hover{ transform:none; }
}


/* ===================================================================
   IW HOME REVAMP 2026-07-30 (hero rotator, proofdeck heading + radius,
   partnerships band, how-we-help journey cards, stack tabs)
   Namespaced additions only; visible-by-default; reduced-motion safe.
   =================================================================== */
.ix-rot{color:#fff;display:inline-block;transition:opacity .36s ease,transform .36s ease}
.ix-rot--out{opacity:0;transform:translateY(.35em)}
.ix-hero__brandline{color:#c9b8ff}
.ix-proofdeck__h{font-family:var(--wp--preset--font-family--heading,inherit);font-size:1.45rem;font-weight:700;color:#0d1224;text-align:center;margin:0 0 20px}
.ix-proofdeck__chip{border-radius:10px}
.ix-pband{background:#fff;padding:44px 24px 50px}
.ix-pband__in{max-width:1120px;margin:0 auto}
.ix-pband__h{font-family:var(--wp--preset--font-family--heading,inherit);font-size:2rem;font-weight:700;color:#0d1224;text-align:center;margin:0}
.ix-pband__lead{max-width:700px;margin:12px auto 0;text-align:center;font-size:15.5px;line-height:1.65;color:#4a4762}
.ix-pband__row{display:flex;justify-content:center;align-items:stretch;gap:18px;margin-top:26px;flex-wrap:wrap}
.ix-pband__card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:190px;padding:24px 18px;background:#fff;border:1px solid #eae2fb;border-top:3px solid var(--ixacc,#50269E);border-radius:16px;box-shadow:0 8px 26px rgba(60,30,130,.07);text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
.ix-pband__card:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(80,38,158,.16)}
.ix-pband__card img{height:26px;width:auto;max-width:130px;object-fit:contain}
.ix-pband__card b{font-size:14px;color:#0d1224}
.ix-help{background:#faf8ff;padding:60px 24px}
.ix-help__in{max-width:1120px;margin:0 auto}
.ix-help__h{font-family:var(--wp--preset--font-family--heading,inherit);font-size:2rem;font-weight:700;color:#0d1224;text-align:center;margin:0}
.ix-help__lead{max-width:700px;margin:12px auto 0;text-align:center;font-size:15.5px;line-height:1.65;color:#4a4762}
.ix-help__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.ix-help__card{background:#fff;border:1px solid #eae2fb;border-radius:18px;padding:26px 24px;box-shadow:0 8px 26px rgba(60,30,130,.06);display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease}
.ix-help__card:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(60,30,130,.13)}
.ix-help__ico{width:44px;height:44px;border-radius:12px;background:#f0ebff;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.ix-help__ico svg{width:22px;height:22px;stroke:#50269E;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ix-help__card h3{font-family:var(--wp--preset--font-family--heading,inherit);font-size:1.12rem;color:#0d1224;margin:0 0 8px}
.ix-help__card p{font-size:13.5px;line-height:1.6;color:#4a4762;flex:1;margin:0}
.ix-help__links{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.ix-help__links a{font-size:12.5px;font-weight:600;color:#50269E;text-decoration:none;background:#f0ebff;padding:6px 11px;border-radius:999px;transition:background .2s ease,transform .2s ease}
.ix-help__links a:hover{background:#ECE6FF;transform:translateY(-2px)}
.ix-help__cta{text-align:center;margin-top:32px}
.ix-help__cta a{display:inline-block;background:#50269E;color:#fff;font-weight:600;font-size:15px;padding:14px 28px;border-radius:12px;text-decoration:none}
.ix-stack{background:#fff;padding:60px 24px}
.ix-stack__in{max-width:1120px;margin:0 auto}
.ix-stack__h{font-family:var(--wp--preset--font-family--heading,inherit);font-size:2rem;font-weight:700;color:#0d1224;text-align:center;margin:0}
.ix-stack__lead{max-width:700px;margin:12px auto 0;text-align:center;font-size:15.5px;line-height:1.65;color:#4a4762}
.ix-stack__tabs{display:flex;justify-content:center;gap:10px;margin-top:28px;flex-wrap:wrap}
.ix-stack__tab{font-size:13.5px;font-weight:600;color:#50269E;background:#f0ebff;border:1px solid #e2d9fa;border-radius:10px;padding:11px 20px;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}
.ix-stack__tab:hover{transform:translateY(-2px)}
.ix-stack__tab.is-on{background:#50269E;color:#fff;border-color:#50269E}
.ix-stack__panel{margin-top:24px}
.ix-stack__pt{font-family:var(--wp--preset--font-family--heading,inherit);font-size:1.05rem;color:#50269E;text-align:center;margin:0 0 4px}
.ix-stack.has-js .ix-stack__pt{display:none}
.ix-stack.has-js .ix-stack__panel{display:none}
.ix-stack.has-js .ix-stack__panel.is-on{display:block;animation:ixpane .45s ease}
@keyframes ixpane{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ix-stack__intro{font-size:14px;color:#4a4762;margin:0 0 18px;text-align:center}
.ix-stack__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}
.ix-stack__card{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1px solid #eae2fb;border-radius:16px;padding:24px 16px 18px;text-decoration:none;box-shadow:0 6px 22px rgba(60,30,130,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.ix-stack__card:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(80,38,158,.14);border-color:#d8c9f6}
.ix-stack__logo{height:44px;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.ix-stack__logo img{height:26px;width:auto;max-width:130px;object-fit:contain}
.ix-stack__mono{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;font-style:normal;font-weight:800;font-size:14px;font-family:var(--wp--preset--font-family--heading,inherit)}
.ix-stack__card b{font-size:14px;color:#0d1224;text-align:center}
.ix-stack__card small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9a8fc0;font-weight:700}
.ix-stack__go{font-size:12.5px;font-weight:600;color:#50269E;margin-top:8px;opacity:0;transform:translateY(3px);transition:opacity .25s ease,transform .25s ease}
.ix-stack__card:hover .ix-stack__go{opacity:1;transform:none}
.ix-stack__more{margin-top:34px}
.ix-stack__morelabel{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9a8fc0;margin-bottom:14px}
.ix-stack__cloud{display:flex;flex-wrap:wrap;gap:9px}
.ix-stack__chip{font-size:12.5px;font-weight:600;color:#0d1224;background:#faf8ff;border:1px solid #e2d9fa;border-radius:999px;padding:7px 14px;transition:transform .2s ease,border-color .2s ease}
.ix-stack__chip:hover{transform:translateY(-2px);border-color:#6b3fc4}
.ix-stack__note{margin-top:14px;font-size:13px;color:#4a4762}
.ix-stack__note a{color:#50269E;font-weight:600;text-decoration:none}
@media (max-width:960px){.ix-help__grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.ix-help__grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){
	.ix-rot,.ix-stack__go{transition:none}
	.ix-stack.has-js .ix-stack__panel.is-on{animation:none}
	.ix-pband__card,.ix-help__card,.ix-stack__card,.ix-help__links a,.ix-stack__tab,.ix-stack__chip{transition:none}
}


/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 2 (hero 2-line + rotator color only,
   trust band tint, stack on feature-tabs anatomy + logo wall,
   reviews platform-ratings strip)
   =================================================================== */
.ix-rot{color:#c9b8ff}
.ix-hero__title{color:#fff}
.ix-trustdeck-wrap--band{background:#faf8ff;padding-top:44px;padding-bottom:48px}
.ix-trustdeck-wrap--band .ix-proofdeck__h{font-size:1.65rem;margin-bottom:24px}
/* stack on ftabs anatomy: only the deltas */
.ix-ftabs--stack .slide-image--wall{display:flex;align-items:center;justify-content:center;background:#faf8ff;border:1px solid #eae2fb;border-radius:16px;min-height:260px;padding:26px}
.ix-stackwall{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center;justify-content:center;max-width:340px}
.ix-stackwall__logo{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #eae2fb;border-radius:12px;padding:12px 18px;box-shadow:0 4px 14px rgba(60,30,130,.06)}
.ix-stackwall__logo img{height:24px;width:auto;max-width:110px;object-fit:contain;display:block}
.ix-ftabs--stack .ix-stack__more{margin-top:30px}
.ix-stack__morelabel{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9a8fc0;margin-bottom:14px}
.ix-stack__cloud{display:flex;flex-wrap:wrap;gap:9px}
.ix-stack__chip{font-size:12.5px;font-weight:600;color:#0d1224;background:#faf8ff;border:1px solid #e2d9fa;border-radius:999px;padding:7px 14px}
.ix-stack__note{margin-top:14px;font-size:13px;color:#4a4762}
.ix-stack__note a{color:#50269E;font-weight:600;text-decoration:none}
/* reviews platform-ratings strip */
.ix-cstory__platforms{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:6px 0 26px}
.ix-cstory__plat{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#0d1224;background:#f0ebff;border:1px solid #e2d9fa;border-radius:10px;padding:10px 16px;text-decoration:none;transition:transform .2s ease,border-color .2s ease}
.ix-cstory__plat:hover{transform:translateY(-2px);border-color:#6b3fc4}
.ix-cstory__plat .stars{color:#f2b01e;letter-spacing:1px;font-size:12px}
@media (prefers-reduced-motion: reduce){.ix-cstory__plat{transition:none}}


/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 3 (stack on ix-svc anatomy: logo-wall
   media slot; trusted-platforms star ratings)
   =================================================================== */
.ix-svc__media--wall{display:flex;align-items:center;justify-content:center;background:#faf8ff;border:1px solid #eae2fb;border-radius:16px;min-height:250px;padding:26px}
.ix-svc__media--wall .ix-stackwall{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;justify-content:center;max-width:340px}
.ix-trustp__stars{display:flex;align-items:center;gap:7px;margin:4px 0 2px}
.ix-trustp__starrow{color:#f2b01e;font-size:13px;letter-spacing:1.5px}
.ix-trustp__stars b{font-size:14px;color:#0d1224}
.ix-trustp__of{font-size:12px;color:#6c6491}

/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 4 (hero-to-cases gap tighten)
   Gradient-washout rule respected: hero height nearly unchanged;
   the cards overlap further up instead. Mobile override untouched.
   =================================================================== */
@media (min-width:901px){
	.ix-hero--noscroll{padding-bottom:400px}
	.ix-cases{margin-top:-640px}
	.ix-hero__actions{position:relative;z-index:3}
}


/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 5 (stack = Bay-Forward pill grid
   inside ix-svc tabs; partnerships logo-only cards)
   =================================================================== */
/* ===================================================================
   FLUID PILOT — Tool Stack converted to the fluid token scale.

   Sizes below come from settings.custom.fluid in theme.json, which WordPress
   emits as --wp--custom--fluid--*. Each is a clamp() that interpolates between
   a 360px and a 1440px viewport and then LOCKS at both ends, so:

     - 1440px and above  -> identical to the old fixed design (by construction:
                            the clamp maxima were taken from the old px values)
     - 360px            -> the old small-screen values
     - in between       -> smooth proportional scale, no jumps

   That is the "same design, sized to the screen" behaviour. The aliases keep the
   authoring names short; the tokens stay in theme.json per CLAUDE.md.

   NOTE what is NOT here any more: this component used to need media queries at
   900px and 560px to resize type, padding, icons and the grid. All of that is
   now expressed once, fluidly. The only breakpoint left is the structural one
   (two columns -> one), and even the pill grid handles itself via auto-fit.
   =================================================================== */
.ix-stacksec{
	--t-sm:      var(--wp--custom--fluid--text-sm);
	--t-md:      var(--wp--custom--fluid--text-md);
	--t-lg:      var(--wp--custom--fluid--text-lg);
	--sp-xs:     var(--wp--custom--fluid--space-xs);
	--sp-sm:     var(--wp--custom--fluid--space-sm);
	--sp-md:     var(--wp--custom--fluid--space-md);
	--sp-lg:     var(--wp--custom--fluid--space-lg);
	--gutter:    var(--wp--custom--fluid--gutter);
	--control-h: var(--wp--custom--fluid--control-h);
	--icon:      var(--wp--custom--fluid--icon-size);
	padding-block: var(--sp-lg);
	padding-inline: var(--gutter);
}
/* Section head. These override the global .ix-sec-title / .ix-sec-sub breakpoint
   steps (0,2,0 beats 0,1,0; media queries add no specificity), so inside this
   section the type scales smoothly instead of stepping at 900 and 480. */
.ix-stacksec .ix-sec-title{ font-size:var(--wp--custom--fluid--text-xl); }
.ix-stacksec .ix-sec-sub{ font-size:var(--t-md); }
.ix-stacksec .ix-svc__tabs{ gap:var(--sp-xs); margin-bottom:var(--sp-sm); }
.ix-stacksec .ix-svc__tab{ font-size:var(--wp--custom--fluid--text-base); }
/* Panel: description column + pill grid. Structural breakpoint only. */
.ix-svc__panel--stack{display:none;grid-template-columns:1fr 1.5fr;gap:var(--sp-md);align-items:start}
.ix-svc__panel--stack.active{display:grid}
.ix-tstack__t{font-family:var(--wp--preset--font-family--heading,inherit);font-size:var(--t-lg);color:#0d1224;margin:6px 0 10px}
.ix-tstack__d{font-size:var(--t-sm);line-height:1.65;color:#4a4762;margin:0 0 var(--sp-xs)}
.ix-tstack__go{font-size:13.5px;font-weight:600;color:#50269E;text-decoration:none}
/* Intrinsic grid: wraps itself when the column can no longer hold 240px. This is
   what removes the "untested band between breakpoints" class of bug entirely —
   there is no width at which this grid is in an unconsidered state.
   min(100%, 240px) stops the track overflowing on very narrow phones. */
.ix-tstack__pills{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,clamp(9.25rem,7rem + 5vw,15rem)),1fr));gap:var(--sp-xs)}
.ix-tpill{display:flex;align-items:center;justify-content:center;gap:var(--sp-xs);min-height:var(--control-h);background:#fff;border:1px solid #eae2fb;border-radius:var(--wp--custom--radius--md,12px);padding:9px 14px;box-shadow:0 6px 20px rgba(60,30,130,.06);transition:transform .22s ease,box-shadow .22s ease}
.ix-tpill:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(80,38,158,.12)}
/* Icon + label: the brand SYMBOL (favicon/app mark) at a fluid square size, with
   the product name set in our own type. Every symbol is square, so all rows match
   automatically and every product name reads at the same size. */
.ix-tpill--icon{justify-content:flex-start;gap:var(--sp-xs)}
.ix-tpill--icon img{flex:none;width:var(--icon);height:var(--icon);max-width:none;object-fit:contain;border-radius:6px}
.ix-tpill--icon span{font-family:'AlmadenSans para',Inter,sans-serif;font-size:var(--t-sm);font-weight:600;line-height:1.25;letter-spacing:-.01em;color:#0d1224;text-wrap:balance}
.ix-tpill__dot{flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-style:normal;font-weight:800;font-size:11.5px;font-family:var(--wp--preset--font-family--heading,inherit)}
.ix-pband__card{padding:28px 18px}
@media (max-width:900px){
	.ix-svc__panel--stack.active{grid-template-columns:1fr}
	/* NOTE: do NOT re-add `.ix-tstack__pills{grid-template-columns:1fr}` here.
	   The fluid pilot base grid (auto-fit + clamp min-track) already handles the
	   column count at every width (~2 per row on a 375px phone, 1 only below
	   ~320px). A hard `1fr` at <=900px defeats it and collapses the pills back to
	   one-per-row on mobile — the exact regression this replaced. */
}
@media (prefers-reduced-motion: reduce){.ix-tpill{transition:none}}


/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 6 (merged partnerships+proof band,
   substantial partner cards, chip row balance, deeper hero gap fix,
   trusted-platforms quote styles)
   =================================================================== */
.ix-pband--merged{background:transparent;padding:56px 24px 60px}
.ix-pband--merged .ix-svc__eyebrow{margin-bottom:10px}
.ix-pband__h{font-size:2rem}
.ix-pband__row{gap:22px;margin-top:32px}
.ix-pband__card{width:200px;min-height:104px;padding:30px 20px;border:1px solid #eee7fb;border-top:3px solid var(--ixacc,#50269E);border-radius:18px;box-shadow:0 12px 30px rgba(60,30,130,.09)}
.ix-pband__card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(80,38,158,.18)}
/* logo-only cards (no link — e.g. Sage, Claude): no pointer, no hover-lift, since they go nowhere */
.ix-pband__card--static{cursor:default}
.ix-pband__card--static:hover{transform:none;box-shadow:0 12px 30px rgba(60,30,130,.09)}
.ix-pband__card img{height:30px;max-width:150px}
.ix-pband__chips{margin-top:34px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.ix-pband__chips .ix-proofdeck__chip{background:#fff}
@media (min-width:1024px){.ix-pband__chips{flex-wrap:nowrap}}
/* deeper hero->cases tighten (supersedes PART 4 values) */
@media (min-width:901px){
	.ix-hero--noscroll{padding-bottom:370px}
}
/* trusted-platforms quotes */
.ix-trustp__quote{font-size:13.5px;line-height:1.6;color:#3a3654;font-style:italic;max-width:300px;margin:10px auto 2px}
.ix-trustp__who{font-size:12px;font-weight:700;color:#6c6491;margin:2px 0 10px}

/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 7 (partnership stat row replaces the
   chip row; count-up rides reveal.js .ix-proofdeck__cnt observer)
   =================================================================== */
.ix-pstats{display:flex;justify-content:center;align-items:stretch;flex-wrap:wrap;gap:16px 0;margin-top:38px}
.ix-pstat{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 38px;position:relative}
.ix-pstat+.ix-pstat::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:1px;background:#e6def8}
.ix-pstat__n{font-size:30px;line-height:1.1;font-weight:800;color:#0d1224;font-family:var(--wp--preset--font-family--heading,inherit)}
.ix-pstat__n b{font-weight:800}
.ix-pstat__l{font-size:12.5px;font-weight:600;color:#6c6491;margin-top:5px}
@media (max-width:760px){
	.ix-pstats{display:grid;grid-template-columns:1fr 1fr;gap:20px 8px}
	.ix-pstat{padding:0 8px}
	.ix-pstat+.ix-pstat::before{display:none}
}
/* Below ~361px the two-up stat row cannot hold its own values. The columns are 1fr,
   i.e. minmax(auto,1fr), and .ix-pstat__n renders unbreakable words at 30px --
   Unlimited measures 160px min-content, Anytime 141px -- so the tracks resolved
   UNEQUAL (129px / 176px) and their total 313px exceeded the 252px container. With
   justify-content:center the oversized track set then bled off BOTH edges (measured
   left:-6px, right:+6px past a 300px viewport). Stack to one column instead of
   shrinking the figures: break-word is not an option here because the value sits in a
   <b>, and a stat reading Unlimi/ted is worse than a taller row. 375px and desktop are
   untouched -- verified identical at 143/176px and flex-row 56px high. 2026-08-28. */
@media (max-width:360px){
	.ix-pstats{ grid-template-columns:minmax(0,1fr); }
}

/* Support page: standalone stat strip section under the hero — reuses the homepage
   partnership stat row (.ix-pstats/.ix-pstat), centered in its own band. */
.ix-sup-stats{background:#fff;padding:clamp(30px,4.5vw,50px) 24px;border-bottom:1px solid #efeaff}
.ix-sup-stats .ix-pstats{margin-top:0}

/* Support "500+ apps" tab: grid of Odoo app tiles (icon + name + desc) in the media column */
.ix-svc__media--apps{ display:block; align-self:start; }
.ix-svc__media--apps img{ aspect-ratio:auto; object-fit:contain; }
.ix-svc__media--apps .ix-appgrid__ic{ width:34px; height:34px; flex:0 0 auto; }
.ix-appgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.ix-appgrid__tile{ display:flex; align-items:center; gap:11px; background:#faf9ff; border:1px solid #ECE6FF; border-radius:12px; padding:10px 12px; }
.ix-appgrid__tx{ display:flex; flex-direction:column; min-width:0; }
.ix-appgrid__name{ font-family:'index happy font',Inter,sans-serif; font-weight:700; font-size:.9rem; color:#0d1224; line-height:1.15; }
.ix-appgrid__desc{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:.74rem; color:#6c6491; line-height:1.25; margin-top:2px; }
.ix-appgrid__more{ display:block; text-align:center; margin-top:14px; font-family:'AlmadenSans para',Inter,sans-serif; font-weight:600; font-size:.82rem; color:#50269E; }
@media (max-width:520px){ .ix-appgrid{ gap:8px; } .ix-appgrid__tile{ padding:9px 10px; gap:9px; } .ix-svc__media--apps .ix-appgrid__ic{ width:28px; height:28px; } }

/* Support "Client portal" tab: the "what's included" checklist in the text column */
.ix-svc__ul{ list-style:none; margin:16px 0 0; padding:0; display:flex; flex-direction:column; gap:11px; }
.ix-svc__ul li{ position:relative; padding-left:20px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14.5px; line-height:1.45; color:var(--text-mid,#4a4f63); }
.ix-svc__ul li strong{ color:var(--text-dark,#0d1224); font-weight:700; }
.ix-svc__ul li::before{ content:""; position:absolute; left:4px; top:8px; width:6px; height:6px; border-radius:50%; background:#50269E; }

/* Support "Client portal" tab: cluster two screenshots (Gantt + dashboard) into roughly
   one image's footprint — Gantt as the base, dashboard overlapping its lower-right. */
.ix-svc__media--cluster{ display:block; position:relative; width:100%; aspect-ratio:16/11; }
/* ONLY the two direct-child screenshots get the collage treatment (not the chip logos) */
.ix-svc__media--cluster > img{ position:absolute; margin:0; border-radius:12px; object-fit:cover; box-shadow:0 14px 34px rgba(0,5,61,.18); }
.ix-svc__media--cluster > img:nth-of-type(1){ top:0; left:0; width:76%; aspect-ratio:16/9; }
.ix-svc__media--cluster > img:nth-of-type(2){ right:0; bottom:0; width:60%; aspect-ratio:2/1; border:3px solid #fff; box-shadow:0 18px 40px rgba(0,5,61,.26); }
/* small "also in your portal" chip in the cluster's free lower-left */
.ix-svc__portalx{ position:absolute; left:0; bottom:0; width:39%; background:#fff; border:1px solid #ECE6FF; border-radius:12px; padding:12px 13px; box-shadow:0 16px 38px rgba(0,5,61,.22); display:flex; flex-direction:column; gap:9px; z-index:3; }
.ix-svc__portalx-eyebrow{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:.6rem; letter-spacing:.05em; text-transform:uppercase; color:#50269E; }
.ix-svc__portalx-row{ display:flex; align-items:center; gap:9px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:.76rem; font-weight:600; color:#1b1d2b; line-height:1.2; }
/* chip logos: hard-reset the inherited .ix-svc__media img rules, then size explicitly */
.ix-svc__portalx img{ position:static; margin:0; border:0; border-radius:0; box-shadow:none; aspect-ratio:auto; object-fit:contain; display:block; }
.ix-svc__portalx .ix-svc__portalx-ic{ flex:0 0 auto; }
.ix-svc__portalx .ix-svc__portalx-ic--sq{ width:20px; height:20px; }
.ix-svc__portalx .ix-svc__portalx-ic--wm{ width:auto; height:15px; }

/* Support types cards: wrap each bullet's text (incl. any link) in one flex item so
   linked bullets don't split into separate items and stay aligned with the check icon. */
.ix-srv-deliver__txt{min-width:0}

/* Support hero only: give the image column more width so the photo reads larger
   (scoped via --lg so the shared .ix-srv-hero on other service pages is unchanged). */
.ix-srv-hero--lg .ix-srv-hero__grid{grid-template-columns:.88fr 1.12fr;gap:52px}
@media (max-width:900px){ .ix-srv-hero--lg .ix-srv-hero__grid{grid-template-columns:1fr} }

/* ===================================================================
   IW HOME REVAMP 2026-07-30 PART 8 (Trusted by Our Clients goes dark:
   navy band + purple glow, brand-accent cards, gold stars, light
   outline buttons. Scoped to .ix-trustp--dark so any light use of the
   pattern elsewhere keeps its old look.)
   =================================================================== */
.ix-trustp--dark{background:radial-gradient(58% 90% at 50% 0%,rgba(80,38,158,.42),transparent 62%),#0d1224;padding:74px 24px 80px}
.ix-trustp--dark .ix-trustp__title{color:#fff}
.ix-trustp--dark .ix-trustp__sub{color:#b9b3d9}
.ix-trustp--dark .ix-trustp__card{background:#151b36;border:1px solid rgba(255,255,255,.08);border-top:3px solid var(--ixacc,#50269E);border-radius:18px;box-shadow:0 18px 44px rgba(0,3,29,.45);transition:transform .25s ease,box-shadow .25s ease}
.ix-trustp--dark .ix-trustp__card:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(0,3,29,.6)}
.ix-trustp--dark .ix-trustp__badge{background:#fff;box-shadow:0 8px 22px rgba(0,3,29,.5)}
.ix-trustp--dark .ix-trustp__name{color:#fff}
.ix-trustp--dark .ix-trustp__starrow{color:#FFC24D}
.ix-trustp--dark .ix-trustp__stars b{color:#fff}
.ix-trustp--dark .ix-trustp__of{color:#948cc0}
.ix-trustp--dark .ix-trustp__quote{color:#d3cdee}
.ix-trustp--dark .ix-trustp__who{color:#948cc0}
.ix-trustp--dark .ix-trustp__btn{color:#fff;border:1px solid rgba(255,255,255,.24);background:transparent;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.ix-trustp--dark .ix-trustp__btn:hover{background:#50269E;border-color:#50269E;transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.ix-trustp--dark .ix-trustp__card,.ix-trustp--dark .ix-trustp__btn{transition:none}}

/* PART 8b: the old grid is repeat(4,1fr) but home shows 3 platforms, which
   left a silent empty 4th column pushing the cards off-balance. Dark band
   gets a true centered 3-up. */
.ix-trustp--dark .ix-trustp__grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1060px}
@media (max-width:1000px){.ix-trustp--dark .ix-trustp__grid{grid-template-columns:1fr;max-width:520px}}

/* ===================================================================
   IW HOME REVAMP PART 9 (hero headline: fixed line count so the rotator
   can't shift the page)

   The rotating word runs "Grow" (4 chars) → "Understand" (10), so
   "<rotator> your business" measured 322px–429px in the heading font at
   the phone size — the short words held one line, the long ones wrapped,
   and the H1 flipped between 2 and 3 lines, shoving the sub + buttons
   down ~35px every cycle.

   Fix: make the breaks structural (block + nowrap) instead of a <br>, so
   the line count is fixed by markup and can't depend on the word. Phones
   drop the rotator onto its own line — a 3-line stack of 223/261/316px
   clears a 375px phone at the full design type size, so nothing shrinks.
   Desktop is unchanged at two lines.
   =================================================================== */
.ix-hero__title .ix-hero__line{ display:block; white-space:nowrap; }
@media (max-width:600px){ .ix-hero__title .ix-hero__np{ display:block; } }

/* ===================================================================
   PART 10 (partnerships: two logo cards per row on phones)

   The cards are a fixed width:200px, so below ~470px two of them
   (400px + 22px gap) no longer clear the row's 327px and they dropped to
   one per row. Going percentage-width puts them back to 2-up; the row is
   already flex/wrap/center, so the odd 5th card centres itself on the
   last row with no extra rule.

   Logo height drops 30px→26px because the widest wordmark (Claude, 4.65:1)
   would be 140px at 30px tall and the half-width card only has ~133px of
   inner room — at 26px it lands at 121px and sits comfortably.
   =================================================================== */
@media (max-width:480px){
	.ix-pband__row{ gap:12px; }
	.ix-pband__card{ width:calc(50% - 6px); min-width:0; padding:22px 12px; min-height:92px; }
	.ix-pband__card img{ height:26px; max-width:100%; }
}

/* PART 11 (What We Do: centre the whole card at every width). The icon badge is a
   fixed 44px box in a column-flex card so it needs margin-inline to centre; the
   heading and paragraph follow text-align; the link pills are a flex row, which
   ignores text-align, so they need justify-content of their own. The section head
   (h2 + lead) and the closing CTA were already centred. */
.ix-help__ico{ margin-inline:auto; }
.ix-help__card{ text-align:center; }
.ix-help__links{ justify-content:center; }

/* PART 12 (mobile: hamburger bars go dark once the header turns solid)

   header-scroll.js adds .is-scrolled past 30px, and that state already flips the
   logo (filter:none) and the desktop nav links to dark — but the burger was left
   out: `.home .ix-burger{ color:#fff }` is unconditional, so on the homepage the
   white bars stayed white on the now white-translucent header and vanished.
   The bars are background:currentColor, so colour alone fixes all three.
   (0,3,0) here outranks `.home .ix-burger` (0,2,0); the nav-open X state already
   sets dark, so the two agree. */
.ix-site-header.is-scrolled .ix-burger{ color:var(--text-dark); }

/* ===================================================================
   PART 13 (Tool Stack tabs become a swipeable rail on mobile — same
   recipe as the Industries "We serve" tab strip, L593-599)

   The five tabs are a centred flex-wrap row, so on a phone they broke
   onto three stacked rows and ate the top of the section. Industries
   solves this with a snap scroller, so this reuses that exact anatomy:
   nowrap + overflow-x:auto + scroll-snap, scrollbar hidden, each tab
   flex:0 0 auto so it keeps its natural width instead of squashing.

   GLOBAL (was scoped to .ix-stacksec). Per request 2026-08-05 the mobile
   swipe rail now applies to EVERY `.ix-svc__tabs` — the home stack + "Our
   Services", the support "Inside your plan", and the service/industry
   pages — so the mobile tab behavior is consistent everywhere the
   component is used (was: only the home stack railed; everything else
   wrapped the tabs into rows).
   =================================================================== */
@media (max-width:900px){
	.ix-svc__tabs{
		flex-wrap:nowrap; justify-content:flex-start; gap:10px;
		overflow-x:auto; overflow-y:hidden;
		padding:4px 2px 10px; margin-bottom:8px;   /* +10px scroll padding = 18px below the rail; see PART 16 */
		-webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory;
		scrollbar-width:none;
	}
	.ix-svc__tabs::-webkit-scrollbar{ display:none; }
	.ix-svc__tab{ flex:0 0 auto; scroll-snap-align:start; padding:10px 14px; font-size:14px; }
}

/* ===================================================================
   PART 14 (Tool Stack pills: fit more than one per row again)

   Below 900px the panel goes single-column and PART 5 also dropped the pill
   grid to `1fr`, so a 12-tool tab like Data Engineering became a ~760px
   stack of one pill per row. auto-fit gives back as many columns as fit
   instead of a hard count: ~5 across at 900px, 2 across on a 375px phone
   (335px of inner room / 148px min), and it falls back to 1 by itself on a
   320px screen rather than squashing. Icon + label ease down a touch so the
   longer names ("Dynamics 365 Finance & Operations") have room to wrap.
   =================================================================== */
/* SUPERSEDED BY THE FLUID PILOT. This block did by breakpoint what the fluid
   tokens now do continuously, and the two agree closely at 900px:
       min-height  fixed 50px   vs fluid 51px
       label       fixed 13.5px vs fluid 13.75px
       grid track  fixed 148px  vs fluid 148px (clamp lower bound)
   The grid min-track is now itself a clamp (9.25rem -> 15rem), so the column
   count adapts continuously instead of stepping at 900px. Kept commented rather
   than deleted so it is easy to restore if the pilot is rejected.
@media (max-width:900px){
	.ix-stacksec .ix-tstack__pills{ grid-template-columns:repeat(auto-fit,minmax(148px,1fr)); gap:10px; }
	.ix-stacksec .ix-tpill{ min-height:50px; padding:8px 12px; }
	.ix-stacksec .ix-tpill--icon img{ width:24px; height:24px; }
	.ix-stacksec .ix-tpill--icon span{ font-size:13.5px; }
}
*/

/* ===================================================================
   PART 15 (blog carousel dots: reach the 24px minimum tap target)

   The dots are 10x10px and clickable, well under the WCAG 2.5.8 24px
   floor and fiddly with a thumb. A centred ::after grows only the HIT
   area, so the dot still *looks* 10px (and 26px wide when active). The
   gap goes 8px→14px so neighbouring 24px targets meet instead of
   overlapping, which would otherwise steal taps for the wrong slide.
   Touch widths only — the desktop look is unchanged.
   (The Case Studies mobile dots need no equivalent: they're
   pointer-events:none indicators, not controls.)
   =================================================================== */
/* PART 17 (partnerships heading accent: "actually runs" in the primary purple).
   Owner-requested 2026-08-03. NOTE this is a deliberate exception to the
   text-color-rule-black-white memory, which reserves #50269E for clickable
   elements — keep it to this one phrase so purple doesn't start reading as
   "tappable" in body copy. Inherits the h2's weight/size; colour only. */
.ix-pband__hl{ color:var(--purple); }

/* ===================================================================
   PART 16 (Tool Stack vertical rhythm on phones)

   The section inherited desktop-sized gaps, which on a phone left three
   stacked voids between the subtitle, the tab rail, the category
   description and the pills:

       subtitle -> tabs        34px  (.ix-services .ix-sec-sub)
       tabs -> description     34px  (rail margin 24 + 10 scroll padding)
       description -> pills    50px  (.ix-tstack__d margin 16 + panel gap 34)

   The 50px is the one that reads as broken: the panel's 34px gap was
   designed as the COLUMN gap between the description and the pill grid on
   desktop, but once the panel collapses to one column that same value
   becomes a row gap and stacks on top of the paragraph's own margin.

   Tightened to 22 / 18 / 20 — about 58px shorter overall, and now a real
   rhythm instead of three equal-looking holes. All scoped to .ix-stacksec.
   =================================================================== */
@media (max-width:900px){
	.ix-stacksec .ix-sec-sub{ margin-bottom:22px; }
	.ix-stacksec .ix-svc__panel--stack{ gap:20px; }
	.ix-stacksec .ix-tstack__d{ margin-bottom:0; }
}

@media (max-width:900px){
	.ix-blogcar__dots{ gap:16px; }
	.ix-blogcar__dot{ position:relative; }
	.ix-blogcar__dot::after{
		content:""; position:absolute; top:50%; left:50%;
		width:24px; height:24px; transform:translate(-50%,-50%);
	}
}


/* ============================================================================
   ICON SYSTEM v3 - THEME HALF (revised 2026-08-04 to the bare-glyph language).
   Ibraheem's direction, from the erp-consultant and construction sections he
   pointed at: challenge-tier icons are BARE 72px glyphs on white - no disc, no
   chip. Chips (54px lilac circle, 30px glyph) belong ONLY to integration and
   connected-tool cards. Hover on bare glyphs is a small lift; hover glyph-to-
   white swaps exist ONLY on chip contexts, where the chip fills with brand.
   v1 names (blueprint platform ledger payroll plant swap feed code vault) get
   a SIZE FIX ONLY (32px in their existing 64px circle contexts on construction
   1291 / real-estate 772) - their containers are already styled by
   .ix-iintg/.ix-iconnect/.ix-iint rules and must not be re-styled here.
   ============================================================================ */
/* v1 names: un-squeeze from 26px to 32px inside their existing 64px circles */
.ix-ichal__icon.ix-ico--blueprint, .ix-ichal__icon.ix-ico--platform, .ix-ichal__icon.ix-ico--ledger, .ix-ichal__icon.ix-ico--payroll, .ix-ichal__icon.ix-ico--plant, .ix-ichal__icon.ix-ico--swap, .ix-ichal__icon.ix-ico--feed, .ix-ichal__icon.ix-ico--code, .ix-ichal__icon.ix-ico--vault{ background-size:32px 32px !important; background-repeat:no-repeat !important; background-position:center !important; }
/* batch-2 names, challenge contexts: bare 72px glyph, no container */
.ix-ichal__icon.ix-ico--storefront, .ix-ichal__icon.ix-ico--artwork, .ix-ichal__icon.ix-ico--press, .ix-ichal__icon.ix-ico--margin, .ix-ichal__icon.ix-ico--terminal, .ix-ichal__icon.ix-ico--marketplace, .ix-ichal__icon.ix-ico--pricelist, .ix-ichal__icon.ix-ico--booking, .ix-ichal__icon.ix-ico--contract, .ix-ichal__icon.ix-ico--payment, .ix-ichal__icon.ix-ico--gps, .ix-ichal__icon.ix-ico--service{ width:85px !important; height:85px !important; min-width:85px !important; margin:0 auto 18px !important; border-radius:0 !important; background-color:transparent !important; box-shadow:none !important; background-repeat:no-repeat !important; background-position:center !important; background-size:72px 72px !important; transition:transform .28s ease !important; }
.ix-ichal__card:hover .ix-ichal__icon.ix-ico--storefront, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--artwork, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--press, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--margin, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--terminal, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--marketplace, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--pricelist, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--booking, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--contract, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--payment, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--gps, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--service{ transform:translateY(-3px) !important; }
/* batch-2 names, integration contexts: 54px chip, 30px glyph */
.ix-iint__icon.ix-ico--storefront, .ix-iint__icon.ix-ico--artwork, .ix-iint__icon.ix-ico--press, .ix-iint__icon.ix-ico--margin, .ix-iint__icon.ix-ico--terminal, .ix-iint__icon.ix-ico--marketplace, .ix-iint__icon.ix-ico--pricelist, .ix-iint__icon.ix-ico--booking, .ix-iint__icon.ix-ico--contract, .ix-iint__icon.ix-ico--payment, .ix-iint__icon.ix-ico--gps, .ix-iint__icon.ix-ico--service{ width:52px !important; height:52px !important; min-width:52px !important; border-radius:14px !important; background-color:#f0ebff !important; background-repeat:no-repeat !important; background-position:center !important; background-size:24px 24px !important; box-shadow:none !important; transition:background-color .28s ease, box-shadow .28s ease !important; }
.ix-iint__card:hover .ix-iint__icon.ix-ico--storefront, .ix-iint__card:hover .ix-iint__icon.ix-ico--artwork, .ix-iint__card:hover .ix-iint__icon.ix-ico--press, .ix-iint__card:hover .ix-iint__icon.ix-ico--margin, .ix-iint__card:hover .ix-iint__icon.ix-ico--terminal, .ix-iint__card:hover .ix-iint__icon.ix-ico--marketplace, .ix-iint__card:hover .ix-iint__icon.ix-ico--pricelist, .ix-iint__card:hover .ix-iint__icon.ix-ico--booking, .ix-iint__card:hover .ix-iint__icon.ix-ico--contract, .ix-iint__card:hover .ix-iint__icon.ix-ico--payment, .ix-iint__card:hover .ix-iint__icon.ix-ico--gps, .ix-iint__card:hover .ix-iint__icon.ix-ico--service{ background-color:#ece2ff !important; box-shadow:none !important; }
/* batch-2 glyph images: purple line glyph on a lavender tile, hover included (2026-08-09) */
/* Storefronts and marketplaces / Your online store */
.ix-ichal__icon.ix-ico--storefront, .ix-iint__icon.ix-ico--storefront{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.8359%20-0.9428%29%20scale%281.06966%29%27%20stroke-width%3D%271.6828%27%3E%3Cpath%20d%3D%27M3.4%209.6%204.6%203.8h14.8l1.2%205.8%27%2F%3E%3Cpath%20d%3D%27M3.4%209.6c0%201.5%201.2%202.7%202.8%202.7s2.8%20-1.2%202.8%20-2.7c0%201.5%201.3%202.7%202.9%202.7%201.6%200%203%20-1.2%203%20-2.7%200%201.5%201.2%202.7%202.8%202.7%201.6%200%202.9%20-1.2%202.9%20-2.7%27%2F%3E%3Cpath%20d%3D%27M5%2012.9V20.4h14V12.9%27%2F%3E%3Cpath%20d%3D%27M10%2020.4v-5h4v5%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Artwork and design files */
.ix-ichal__icon.ix-ico--artwork, .ix-iint__icon.ix-ico--artwork{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.1867%20-0.6944%29%20scale%281.01556%29%27%20stroke-width%3D%271.7724%27%3E%3Cpath%20d%3D%27M4.6%2019.4C7.2%2011.6%2012.4%207%2019.4%205.6%27%2F%3E%3Crect%20x%3D%272.8%27%20y%3D%2717.6%27%20width%3D%273.6%27%20height%3D%273.6%27%20rx%3D%27.7%27%2F%3E%3Crect%20x%3D%2717.6%27%20y%3D%273.8%27%20width%3D%273.6%27%20height%3D%273.6%27%20rx%3D%27.7%27%2F%3E%3Ccircle%20cx%3D%2711.2%27%20cy%3D%2711.6%27%20r%3D%271.5%27%2F%3E%3Cpath%20d%3D%27M12.3%2010.5l4.2-3.4%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Presses and RIP software */
.ix-ichal__icon.ix-ico--press, .ix-iint__icon.ix-ico--press{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.7286%20-1.2589%29%20scale%281.06071%29%27%20stroke-width%3D%271.6970%27%3E%3Cpath%20d%3D%27M5%208.4V4.6h14v3.8%27%2F%3E%3Crect%20x%3D%272.8%27%20y%3D%278.4%27%20width%3D%2718.4%27%20height%3D%277.2%27%20rx%3D%271.8%27%2F%3E%3Cpath%20d%3D%27M6.4%2012h.01M9.4%2012h.01%27%2F%3E%3Cpath%20d%3D%27M6.6%2015.6h10.8v4.8H6.6z%27%2F%3E%3Cpath%20d%3D%27M9%2018h6%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Cost and margin per job */
.ix-ichal__icon.ix-ico--margin, .ix-iint__icon.ix-ico--margin{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.3120%20-0.3120%29%20scale%281.00524%29%27%20stroke-width%3D%271.7906%27%3E%3Cpath%20d%3D%27M3.2%2012.2V4.4a1.2%201.2%200%200%201%201.2-1.2h7.8l8.6%208.6a1.7%201.7%200%200%201%200%202.4l-6.6%206.6a1.7%201.7%200%200%201-2.4%200z%27%2F%3E%3Cpath%20d%3D%27M7.1%207.1h.01%27%2F%3E%3Cpath%20d%3D%27M9.8%2016.2l6-6M10.6%2011a1.2%201.2%200%201%200%200-.01M15.4%2015.8a1.2%201.2%200%201%200%200-.01%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Tills and card terminals */
.ix-ichal__icon.ix-ico--terminal, .ix-iint__icon.ix-ico--terminal{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-3.8350%20-3.1260%29%20scale%281.18172%29%27%20stroke-width%3D%271.5232%27%3E%3Crect%20x%3D%276.6%27%20y%3D%276.8%27%20width%3D%2710.8%27%20height%3D%2714.4%27%20rx%3D%271.8%27%2F%3E%3Crect%20x%3D%279%27%20y%3D%279.4%27%20width%3D%276%27%20height%3D%273.2%27%20rx%3D%27.6%27%2F%3E%3Cpath%20d%3D%27M9.4%2015.4h.01M12%2015.4h.01M14.6%2015.4h.01M9.4%2018h.01M12%2018h.01M14.6%2018h.01%27%2F%3E%3Cpath%20d%3D%27M9.2%204.4h9.4a1.6%201.6%200%200%201%201.6%201.6v2.4%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Marketplaces */
.ix-ichal__icon.ix-ico--marketplace, .ix-iint__icon.ix-ico--marketplace{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.1212%20-0.1212%29%20scale%281.01010%29%27%20stroke-width%3D%271.7820%27%3E%3Crect%20x%3D%273%27%20y%3D%273%27%20width%3D%278%27%20height%3D%278%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%2713%27%20y%3D%273%27%20width%3D%278%27%20height%3D%278%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%273%27%20y%3D%2713%27%20width%3D%278%27%20height%3D%278%27%20rx%3D%271.6%27%2F%3E%3Crect%20x%3D%2713%27%20y%3D%2713%27%20width%3D%278%27%20height%3D%278%27%20rx%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M15.6%2017h2.8M17%2015.6v2.8%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Suppliers and price files */
.ix-ichal__icon.ix-ico--pricelist, .ix-iint__icon.ix-ico--pricelist{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-1.8317%20-1.0693%29%20scale%281.08911%29%27%20stroke-width%3D%271.6527%27%3E%3Cpath%20d%3D%27M6%202.8h8.4L19.4%207.8V21.2H6z%27%2F%3E%3Cpath%20d%3D%27M14%203.2V8h4.8%27%2F%3E%3Cpath%20d%3D%27M9%2012.6h6.4M9%2015.4h6.4M9%2018.2h4%27%2F%3E%3Cpath%20d%3D%27M10.9%209.9c-.5-.6-1.7-.7-2.2%200-.5.6-.1%201.4.9%201.5%201%20.1%201.5.9%201%201.5-.5.7-1.8.6-2.3%200%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Online booking and quotes */
.ix-ichal__icon.ix-ico--booking, .ix-iint__icon.ix-ico--booking{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%280.0584%200.1579%29%20scale%280.99514%29%27%20stroke-width%3D%271.8088%27%3E%3Crect%20x%3D%273%27%20y%3D%274.6%27%20width%3D%2718%27%20height%3D%2716.6%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M3%209.4h18%27%2F%3E%3Cpath%20d%3D%27M8%202.6v3.6M16%202.6v3.6%27%2F%3E%3Cpath%20d%3D%27M8.6%2015.2l2.3%202.3%204.5-4.7%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Contracts and e-signature */
.ix-ichal__icon.ix-ico--contract, .ix-iint__icon.ix-ico--contract{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-1.8317%20-1.0693%29%20scale%281.08911%29%27%20stroke-width%3D%271.6527%27%3E%3Cpath%20d%3D%27M6%202.8h8.4L19.4%207.8V21.2H6z%27%2F%3E%3Cpath%20d%3D%27M14%203.2V8h4.8%27%2F%3E%3Cpath%20d%3D%27M8.8%2017.8c1-.9%201.8-2.4%201.4-3.2-.3-.7-1.3-.4-1.4.5-.1%201.2%201%202.9%202.2%202.9.8%200%201.2-.8%201.7-.8.4%200%20.6.6%201.3.6h2.6%27%2F%3E%3Cpath%20d%3D%27M9%206.8h3.4%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Payments and deposits */
.ix-ichal__icon.ix-ico--payment, .ix-iint__icon.ix-ico--payment{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.8155%20-0.8155%29%20scale%281.06796%29%27%20stroke-width%3D%271.6855%27%3E%3Crect%20x%3D%272.6%27%20y%3D%275.4%27%20width%3D%2718.8%27%20height%3D%2713.2%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M2.6%209.6h18.8%27%2F%3E%3Cpath%20d%3D%27M6.2%2014.6h4%27%2F%3E%3Cpath%20d%3D%27M15.2%2014.4h3%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Telematics and GPS */
.ix-ichal__icon.ix-ico--gps, .ix-iint__icon.ix-ico--gps{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-2.1935%20-3.1398%29%20scale%281.18280%29%27%20stroke-width%3D%271.5218%27%3E%3Cpath%20d%3D%27M12%2021.2s6.4-5.9%206.4-10.4a6.4%206.4%200%201%200-12.8%200C5.6%2015.3%2012%2021.2%2012%2021.2z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2710.6%27%20r%3D%272.3%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }
/* Service, parts and maintenance */
.ix-ichal__icon.ix-ico--service, .ix-iint__icon.ix-ico--service{ background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2350269E%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cg%20transform%3D%27translate%28-0.7796%200.7134%29%20scale%281.03734%29%27%20stroke-width%3D%271.7352%27%3E%3Cpath%20d%3D%27M20.8%206.2a5%205%200%200%201-6.9%206.1L7.2%2019a2.1%202.1%200%200%201-3-3l6.7-6.7a5%205%200%200%201%206.1-6.9L13.6%205.8l.4%204.2%204.2.4z%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") !important; }

/* ===== ix-iint COMPONENT, DE-SCOPED INTO THE THEME (queued 2026-08-04) =====
   This block previously existed only as page-content copies (805 etc.) and as .page-id-923
   rules in the Customizer. Pages relying on those copies lose ALL card styling whenever
   LiteSpeed UCSS regenerates (observed live on print-on-demand, retail-erp, equipment-rental:
   flat text cards for guests). In the theme it is a stable source every page can keep.
   Copied verbatim from the proven 805 in-page block; nothing redesigned. ===== */
.ix-iint { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.ix-iint__grid { grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-top: 2.5rem; display: grid !important; }
@media (max-width: 960px){.ix-iint__grid { grid-template-columns: repeat(2, 1fr); }}
@media (max-width: 600px){.ix-iint__grid { grid-template-columns: 1fr; }}
.ix-iint__card { background: rgb(255, 255, 255); border: 1px solid rgb(229, 225, 239); border-radius: 14px; padding: 1.6rem 1.5rem 1.5rem; display: flex; flex-direction: column; transition: box-shadow 0.2s, border-color 0.2s, transform 0.2s; }
.ix-iint__card:hover { border-color: rgb(201, 188, 230); box-shadow: rgba(80, 38, 158, 0.1) 0px 10px 28px; transform: translateY(-3px); }
.ix-iint__icon { display: inline-flex; width: 54px; height: 54px; border-radius: 50%; background-color: rgb(242, 236, 251); background-repeat: no-repeat; background-position: center center; background-size: 27px 27px; box-shadow: rgba(80, 38, 158, 0.07) 0px 0px 0px 1px inset; margin-bottom: 1.1rem; transition: background-color 0.25s; }
.ix-iint__card:hover .ix-iint__icon { background-color: rgb(230, 219, 248); }
.ix-iint__h3 { font-weight: 700; color: rgb(20, 18, 26); margin: 0px 0px 0.5rem !important; font-size: 1.15rem !important; line-height: 1.3 !important; }
.ix-iint__tag { display: inline-block; align-self: flex-start; padding: 0.28rem 0.7rem; background: rgb(242, 236, 251); border-radius: 999px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: rgb(80, 38, 158); margin: 0px 0px 0.9rem !important; font-size: 0.72rem !important; line-height: 1.3 !important; }
.ix-iint__p { color: rgb(74, 71, 86); margin: 0px 0px 1.1rem !important; font-size: 0.96rem !important; line-height: 1.62 !important; }
.ix-iint__ben { padding-top: 0.9rem; border-top: 1px solid rgb(239, 236, 246); font-weight: 600; color: rgb(80, 38, 158); margin: auto 0px 0px !important; font-size: 0.95rem !important; line-height: 1.5 !important; }
.ix-iint__foot { max-width: 720px; text-align: center; color: rgb(74, 71, 86); margin: 2.25rem auto 0px !important; font-size: 1.02rem !important; line-height: 1.6 !important; }
.ix-iint__foot a { color: rgb(80, 38, 158); font-weight: 700; white-space: nowrap; }
/* layout guard for cloned sections */
.ix-iint>*,.ix-restack>*{max-width:1200px;margin-left:auto;margin-right:auto;}
/* The rule above sizes the CARD GRID, but it catches every direct child, so the section's
   own intro paragraph was being stretched to 1200px too. At 0,1,1 it outranks .ix-sec-sub
   (0,1,0, 760px), so the sub under "Keep the Tools You Rely On" ran the full 1200px measure
   while the identical .ix-sec-sub one section above it (.ix-ichal) sat at 760px — two
   consecutive centred intros on visibly different measures. Owner, 2026-08-25: "width of
   this should be same the previous section". 0,2,0 beats 0,1,1, so this restores the base
   measure without touching the grid. Same shape of bug as .ix-igrid__card p vs
   .ix-igrid__ben — a rule ending in a type selector quietly outranking the class that
   was meant to own the property. */
.ix-iint>.ix-sec-sub,.ix-restack>.ix-sec-sub{ max-width:760px; }

/* The layout guard above gives these sections max-width + auto margins but no side
   padding, so below the point where max-width bites, the heading and intro run flush to
   both screen edges. Owner, 2026-08-28: no padding left/right around the paragraphs.
   Measured on /manufacturing-industry/: h2 and sub 0 -> 375 at 375px and 0 -> 753 at
   768px, while .ix-iwhat and .ix-ichal on the same page sit at 18px. The heading has no
   inset at all until max-width:1200px catches it, so this runs to 1024, not just phones.
   Padding goes on the SECTION, not the children, and needs html body + !important: the
   per-page injected <style> blocks set the padding SHORTHAND, which zeroes the inline axis
   and sits later in the cascade -- .ix-igridsec{padding:64px 0 72px} on office-furniture,
   and .ix-eduseg{padding:3rem 0 3.5rem !important} on education and hotel. The grid then has its own 24px
   zeroed (at html body specificity, to beat the rule near ix-iint__grid below) so cards
   land on the same 18px line as the text instead of 42px.
   Verified 2026-08-28 on manufacturing + aviation: everything 18 -> 357 at 375px,
   18 -> 735 at 768px; 1440 byte-identical (h2 131/1295, sub 344/1081, card 173/520). */
@media (max-width:1024px){
	html body .ix-iint, html body .ix-iadv, html body .ix-iclose, html body .ix-eduseg,
	html body .ix-igridsec, html body .ix-iintg, html body .ix-iconnect{ padding-inline:18px !important; }
	/* wrappers that already inset themselves must not double up on top of the section */
	html body .ix-iint > .ix-iint__grid, html body .ix-iadv > .ix-adv__grid,
	html body .ix-igridsec > h2, html body .ix-igridsec .ix-igrid,
	html body .ix-iint .ix-whyx{ padding-inline:0 !important; }
}


/* ===== SECTION EYEBROWS 2026-08-08 =====
   The render-time eyebrow filter (functions.php "SECTION EYEBROWS", 2026-08-05) is
   RETIRED per 00_EYEBROW_AUDIT_2026-08-06.md: 84 of its 127 injected labels restated
   the heading under them, and a rule keyed on prose broke every time an H2 was edited.
   Keeper badges are now explicit ix_badge() calls inside the patterns. One shared
   wrapper for the answer/cost blocks that had none, centred like every other
   *__eyebrow wrapper on the site (the audit's "centred, always" rule). */
.ix-iwhat__eyebrow{ display:flex; justify-content:center; margin:0 0 12px; }

/* ===== Integration-section fixes 2026-08-08 (ported from page 772) =====
   The .ix-eduint variant of this grid ships three latent defects in the Customizer
   CSS (SITE-CHANGELOG rows 379-380), still live on /education-erp/ (996) and
   /hotel-management/ (1324):
   1) cards REST at opacity:0 and depend on the ixEduRise animation to reveal them,
      so a suppressed animation renders a blank grid. Fail-open: rest at opacity:1;
      animation-fill-mode:both keeps the staggered entrance identical when the
      animation does run (from{opacity:0} applies through each card's delay).
   2) the full-card hover wash (::before) is crushed to a 3px strip by an inherited
      height it never clears; height:auto restores it (inset:0 supplies the size).
   3) the icon pulse (ixEduPulse) animates box-shadow on the icon itself, where an
      !important box-shadow outranks it and it never plays. Re-implemented on a
      dedicated ::after ring that nothing else styles, so it cannot be blocked.
   The `html body` prefix outranks the Customizer's class-only selectors without
   !important and regardless of load order (same device as the .ix-iwhy fix below). */
html body .ix-eduint .ix-iint__card{ opacity:1; animation-fill-mode:both; }
html body .ix-eduint .ix-iint__card::before{ height:auto; }
html body .ix-eduint .ix-iint__icon{ position:relative; }
html body .ix-eduint .ix-iint__icon::after{ content:""; position:absolute; inset:0; border-radius:50%; pointer-events:none; }
html body .ix-eduint .ix-iint__card:hover .ix-iint__icon::after{ animation:ixIntPulse 1.4s ease-out infinite; }
@keyframes ixIntPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(80,38,158,.28); } 50%{ box-shadow:0 0 0 12px rgba(80,38,158,0); } }
@media (prefers-reduced-motion:reduce){
	html body .ix-eduint .ix-iint__card{ animation:none; }
	html body .ix-eduint .ix-iint__card:hover .ix-iint__icon::after{ animation:none; }
}

/* ===== "Why they choose Index World" band 2026-08-05 =====
   The block rendered with zero padding and no background, so it butted straight into the
   section above it and read as that section's tail rather than a section of its own
   (Ibraheem: "looks like a part of the previous section"). It now takes the site's normal
   section rhythm and puts the three cards on a contained lavender panel, which is the same
   device the proof band uses and reads clearly as one object on a white page. The selector
   carries `html body` so it outranks the per-page inline styles that ship inside the page
   content, without needing !important and regardless of load order. */
html body .ix-iwhy{ padding:70px 24px; }
html body .ix-whyx{ background:#f7f5fc; border:1px solid #efeaf9; border-radius:24px; padding:30px 26px; margin:24px auto 0; max-width:1120px; }
html body .ix-whyx__c{ background:#fff; border-color:#e9e2f7; box-shadow:0 2px 10px rgba(80,38,158,.05); }
@media (prefers-reduced-motion:no-preference){
	html body .ix-whyx__c{ transition:box-shadow .3s ease, transform .3s ease, border-color .3s ease; }
	html body .ix-whyx__c:hover{ transform:translateY(-3px); border-color:#c9bce6; box-shadow:0 16px 34px rgba(80,38,158,.13); }
}
@media (max-width:600px){
	html body .ix-iwhy{ padding:48px 16px 54px; }
	html body .ix-whyx{ padding:20px 16px; border-radius:18px; }
}

/* ===== HERO BALANCE + TRUST BAR 2026-08-05 =====
   Ibraheem: "The image is small and the h2 is too lengthy, the checks are also too much."
   Measured on the live page: the copy column ran 620-665px tall while the hero image was
   fixed at 527x351 by a 3/2 ratio, so the picture read as a thumbnail parked beside a wall
   of text. Three changes, and the last one is the reason the other two work.

   1. The image gets the room. Columns go even (1fr 1fr, gap 56->48) and the ratio goes
      3/2 -> 4/3, taking the image from 527x351 to 576x432, about 55% more picture. The
      sources are 3:2 landscape so the crop loses ~11% of width, nothing structural.
      Applied to every hero, because every hero had the same imbalance.
   2. The six proof lines leave the hero and become their own band underneath it. Nothing
      is deleted: all six survive word for word, they just stop competing with the headline
      and now read as a trust strip, which is what they always were. That alone takes 128px
      of stacked list out from under the H1.
   3. Service-page headlines drop to 44px, which is the size at which each shortened H1
      lands on exactly two lines in a 578px column - verified by measuring the rendered
      line count for every one of the five, rather than guessing at a type scale. */
.ix-ihero__grid{ grid-template-columns:1fr 1fr; gap:48px; }
.ix-ihero__media img{ aspect-ratio:4/3; }
.ix-ihero--svc .ix-ihero__title{ font-size:clamp(30px,3.2vw,42px); text-wrap:balance; }
.ix-ihero--svc{ padding-bottom:52px; }
/* Re-assert the mobile stack. The base `1fr 1fr` above (HERO BALANCE 2026-08-05) sits later in
   the cascade than the original @media(max-width:900px) collapse, so it was overriding it and
   every .ix-ihero hero rendered as 2 cramped columns on phones (text wrapped one word per line).
   Restore the single-column stack on small screens — applies to every service/industry hero. */
@media (max-width:900px){ .ix-ihero__grid{ grid-template-columns:1fr; gap:32px; } }


/* ===== TRUST STRIP v2 2026-08-05 =====
   The first version put the six hero proof lines into a band unchanged, and Ibraheem
   called it right: six tick rows is a bulleted list wearing a band's clothes. A
   credential bar should lead with credentials, so the figures lead, the Odoo partner
   mark sits beside them and stays verifiable on odoo.com, and the per-page promises
   drop to one fine-print line so not one of them is lost. Height lands around 120px
   against the 168px the tick grid needed. */
.ix-htrust{ background:#f0ebff; border-bottom:1px solid #e4dcfa; padding:24px; }   /* single credential row: symmetric padding now the promises line is retired */
.ix-htrust__in{ max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:14px 30px; }
.ix-htrust__partner{ order:2; display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid #e0d6f7; border-radius:99px; padding:8px 16px 8px 14px; text-decoration:none; transition:box-shadow .25s ease, transform .25s ease; }
.ix-htrust__partner:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(80,38,158,.14); }
.ix-htrust__partner img{ display:block; height:18px; width:auto; }
.ix-htrust__pt{ font-family:'index happy font',Inter,sans-serif; font-size:13.5px; font-weight:600; color:#00053D; line-height:1.2; display:flex; flex-direction:column; }
.ix-htrust__pt em{ font-style:normal; font-family:'AlmadenSans para',Inter,sans-serif; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:#50269E; }
.ix-htrust__stats{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px 34px; }   /* a little more air between figures on the single row */
.ix-htrust__stats li{ display:flex; align-items:baseline; gap:7px; position:relative; }
.ix-htrust__stats li + li::before{ content:''; position:absolute; left:-14px; top:2px; bottom:2px; width:1px; background:#ddd1f5; }
.ix-htrust__stats b{ font-family:'index happy font',Inter,sans-serif; font-size:21px; font-weight:600; color:#50269E; line-height:1; }
.ix-htrust__stats span{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:13.5px; color:#3c4258; line-height:1.25; }
.ix-htrust__promises{ max-width:1040px; margin:12px auto 0; text-align:center; text-wrap:balance; font-family:'AlmadenSans para',Inter,sans-serif; font-size:12.5px; line-height:1.7; color:#5b5470; }
.ix-htrust__promises span{ color:#b9a8e0; padding:0 8px; }
@media (max-width:1100px){
	.ix-htrust__stats{ gap:10px 22px; }
	.ix-htrust__stats li + li::before{ left:-11px; }
	.ix-htrust__stats b{ font-size:19px; }
}
@media (max-width:700px){
	.ix-htrust{ padding:22px 16px; }
	.ix-htrust__in{ gap:12px 18px; }
	/* 2x2 grid, figure stacked over its label (2026-08-14, Waqas). The row layout
	   was built for desktop: four li on one line with b and span side by side. On a
	   phone that reflowed into four ragged rows of unequal width, and the figure -
	   the only part anyone actually reads - was the same weight as the caption next
	   to it. Two columns of four gives every cell the same box, and stacking centres
	   the figure over its label so the numbers read first. Exactly four stats ship
	   from ix_trust_strip(), so the grid is always full. */
	/* align-items:start overrides the flex-row default of `center` inherited from the
	   base rule: one label wraps to two lines, and centred cells would push the shorter
	   cell's figure ~8px down so the two numbers in a row no longer share a baseline. */
	.ix-htrust__stats{ display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:20px 14px; width:100%; max-width:420px; }
	.ix-htrust__stats li{ flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; gap:4px; }
	.ix-htrust__stats li + li::before{ display:none; }
	.ix-htrust__stats b{ font-size:30px; font-weight:800; line-height:1.05; }
	.ix-htrust__stats span{ font-size:12.5px; line-height:1.3; text-wrap:balance; }
	.ix-htrust__promises{ font-size:12px; }
}

/* ===== APPS GRID 2026-08-05 =====
   The single-vendor translation of the device Rand Group closes their industry pages
   with: a grid of the products the solution is built from, each with a real anchor into
   a money page. Theirs lists four vendors; ours lists the Odoo apps, which is the honest
   version of the same idea and answers the question a buyer actually has at that point
   in the page, namely which pieces do I need. It also repairs an internal-linking defect
   found while comparing: the story carousel was carrying five of this page's links behind
   bare images with no anchor text. */
.ix-appgrid{ background:#fff; padding:74px 24px 78px; }
/* theme.json sets contentSize 768px, and WordPress applies that to the children of a
   full-width group. Left alone, this section would render its grid inside a 768px column
   in the middle of a 1557px band. `html body` (0,1,3) puts it beyond any of the generated
   layout rules without !important, and the explicit width stops the cap applying at all. */
html body .ix-appgrid > .ix-appgrid__in{ width:100%; max-width:1160px; margin-left:auto; margin-right:auto; }
.ix-appgrid__eb{ display:flex; justify-content:center; margin:0 0 12px; }
.ix-appgrid__h{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:clamp(28px,3vw,40px); line-height:1.14; text-align:center; color:#00053D; margin:0 auto 12px; max-width:880px; text-wrap:balance; }
.ix-appgrid__lead{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:16px; line-height:1.65; color:#4a4f63; text-align:center; max-width:720px; margin:0 auto 34px; }
.ix-appgrid__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.ix-appgrid__c{ display:flex; flex-direction:column; background:#fbfaff; border:1px solid #ece7f8; border-radius:18px; padding:24px 22px 20px; }
.ix-appgrid__tag{ align-self:flex-start; font-family:'AlmadenSans para',Inter,sans-serif; font-size:11.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:#50269E; background:#ECE6FF; border-radius:99px; padding:5px 11px; margin:0 0 13px; }
.ix-appgrid__ct{ font-family:'index happy font',Inter,sans-serif; font-weight:600; font-size:18px; line-height:1.3; color:#00053D; margin:0 0 9px; }
.ix-appgrid__lede{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:14.5px; line-height:1.62; color:#4a5568; margin:0 0 14px; }
/* Three lines per card, always. The row is symmetrical because every card is built to the
   same shape, not because the copy happened to come out the same length: tag, title, one
   lead sentence, exactly three points, one link. `stretch` equalises the heights and the
   link is pushed to a shared baseline with margin-top:auto. */
.ix-appgrid__pts{ list-style:none; margin:0 0 18px; padding:0; display:grid; gap:9px; }
.ix-appgrid__pts li{ position:relative; padding-left:20px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:13.8px; line-height:1.5; color:#3c4258; }
.ix-appgrid__pts li::before{ content:''; position:absolute; left:0; top:7px; width:7px; height:7px; border-radius:50%; background:#c9b8ee; }
.ix-appgrid__go{ margin-top:auto; display:inline-flex; align-items:center; gap:8px; font-family:'AlmadenSans para',Inter,sans-serif; font-size:14px; font-weight:600; color:#50269E; text-decoration:none; }
.ix-appgrid__go span{ transition:transform .25s ease; }
.ix-appgrid__foot{ font-family:'AlmadenSans para',Inter,sans-serif; font-size:15px; line-height:1.65; color:#4a4f63; text-align:center; max-width:720px; margin:32px auto 0; }
.ix-appgrid__foot a{ color:#50269E; font-weight:600; }
@media (prefers-reduced-motion:no-preference){
	.ix-appgrid__c{ transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
	.ix-appgrid__c:hover{ transform:translateY(-3px); border-color:#d6c9f0; box-shadow:0 16px 34px rgba(80,38,158,.11); }
	.ix-appgrid__c:hover .ix-appgrid__go span{ transform:translateX(4px); }
}
@media (max-width:1000px){ .ix-appgrid__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px){
	.ix-appgrid{ padding:52px 16px 56px; }
	.ix-appgrid__grid{ grid-template-columns:1fr; gap:14px; }
}

/* Story carousel is a story, not a menu (Ibraheem 2026-08-05): the cards were anchors
   into other pages, which pulled readers out mid-narrative. They are plain <div>s now,
   so the reader stays on the page. The description reads as text under the card. */
/* Back to default. An earlier pass today set this to inherit so the photo would pick up
   the viewport's grab and match the card text - the right call while the hand existed,
   but the owner wanted the hand gone, not spread, and grab has now been removed from the
   viewport above. inherit would resolve to default anyway; stating it keeps the intent
   readable. a.ix-iccar__media below still wins for cards that really are links. */
.ix-iccar__media{ cursor:default; }
/* ...but that rule was written unscoped, so it also stripped the pointer from the cards
   that ARE links - every case-study carousel (/erp-consultant/, /erp-implementation/,
   /erp-integration/, /erp-migration/, /erp-selection/, /odoo-customization/,
   /odoo-partner/). Nine real links per page hovered like dead images. Restored 2026-08-25.

   The contract for this component, stated once here: a card is clickable if and only if
   .ix-iccar__media is an <a>. All three affordances key off that and nothing else -
   the arrow badge (a.ix-iccar__media .ix-iccar__arrow, ~line 1317), the image zoom
   (~line 1436) and the cursor below. Author a card as <div> and it is inert with no
   further work; author it as <a> and it announces itself. No page-specific rules. */
a.ix-iccar__media{ cursor:pointer; }

/* Case-study card outcome line (2026-08-09) */
.ix-csa__card-outcome{margin:8px 0 0;font-size:14.5px;line-height:1.55;color:#4a5568;}

/* ===== INTEGRATION GRID: ONE TREATMENT, BOTH MARKUP FAMILIES (2026-08-09) =====
   The bento treatment the owner approved shipped on /real-estate-erp/ (772) and lived only
   inside that page's own <style> block: "ix-igrid" appeared in no stylesheet on the site, so
   fourteen other industry pages rendered a flatter, older version of the same section. This
   promotes it to the theme and states it once for both vocabularies, ".ix-igridsec .ix-igrid__*"
   (772, 1232, 1291, 760, 912) and ".ix-iint .ix-iint__*" (1201, 923, 1189, 805, 996, 1324, 657,
   1166, 1873), so every page gets it without one of them being re-authored.
   The "html body" prefix outranks the page-inline copies and the Customizer's .ix-eduint rules
   without !important and regardless of load order (same device as the .ix-eduint fix above), so
   the page-local copies can be stripped later as cleanup: they no longer decide anything.
   Icon language: lavender tile, purple line glyph, taken from the home-page bento
   (.ix-help__ico, 44px tile / 22px glyph) and scaled to 52px / 24px for the larger card.
   The tile !important rules at .ix-iint .ix-iint__icon and .ix-iint__icon.ix-ico--* were edited
   in place to the same values in this pass, because !important cannot be outranked from here. */

/* --- grid geometry --- */
html body .ix-igridsec .ix-igrid,
html body .ix-iint .ix-iint__grid{
	display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;
	max-width:1160px; margin:34px auto 0; padding:0 24px;
}
@media (max-width:960px){
	html body .ix-igridsec .ix-igrid,
	html body .ix-iint .ix-iint__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
	html body .ix-igridsec .ix-igrid,
	html body .ix-iint .ix-iint__grid{ grid-template-columns:1fr; }
}

/* --- card. opacity:1 is declared before the animation so the grid is readable even if the
       animation never runs: the keyframe carries its own from{opacity:0}. That is the
       fail-open the .ix-eduint cards did not have (SITE-CHANGELOG row 380). --- */
html body .ix-igridsec .ix-igrid__card,
html body .ix-iint .ix-iint__card{
	position:relative; overflow:hidden; background:#fff;
	border:1px solid #eae2fb; border-radius:18px; padding:26px 24px 24px;
	display:flex; flex-direction:column; text-align:center; align-items:center;
	box-shadow:0 8px 26px rgba(60,30,130,.06);
	opacity:1;
	animation:ixIntRise .6s cubic-bezier(.22,.9,.3,1) both;
	transition:box-shadow .3s ease,border-color .3s ease,transform .3s ease;
}
@keyframes ixIntRise{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:translateY(0); } }

/* staggered entrance, 12 steps: 912 and 1166 run 12 cards and 760 runs 9, so 772's
   original five delays would have landed every later card at once. */
html body .ix-igridsec .ix-igrid__card:nth-child(1),  html body .ix-iint .ix-iint__card:nth-child(1){ animation-delay:.05s; }
html body .ix-igridsec .ix-igrid__card:nth-child(2),  html body .ix-iint .ix-iint__card:nth-child(2){ animation-delay:.11s; }
html body .ix-igridsec .ix-igrid__card:nth-child(3),  html body .ix-iint .ix-iint__card:nth-child(3){ animation-delay:.17s; }
html body .ix-igridsec .ix-igrid__card:nth-child(4),  html body .ix-iint .ix-iint__card:nth-child(4){ animation-delay:.23s; }
html body .ix-igridsec .ix-igrid__card:nth-child(5),  html body .ix-iint .ix-iint__card:nth-child(5){ animation-delay:.29s; }
html body .ix-igridsec .ix-igrid__card:nth-child(6),  html body .ix-iint .ix-iint__card:nth-child(6){ animation-delay:.35s; }
html body .ix-igridsec .ix-igrid__card:nth-child(7),  html body .ix-iint .ix-iint__card:nth-child(7){ animation-delay:.41s; }
html body .ix-igridsec .ix-igrid__card:nth-child(8),  html body .ix-iint .ix-iint__card:nth-child(8){ animation-delay:.47s; }
html body .ix-igridsec .ix-igrid__card:nth-child(9),  html body .ix-iint .ix-iint__card:nth-child(9){ animation-delay:.53s; }
html body .ix-igridsec .ix-igrid__card:nth-child(10), html body .ix-iint .ix-iint__card:nth-child(10){ animation-delay:.59s; }
html body .ix-igridsec .ix-igrid__card:nth-child(11), html body .ix-iint .ix-iint__card:nth-child(11){ animation-delay:.65s; }
html body .ix-igridsec .ix-igrid__card:nth-child(12), html body .ix-iint .ix-iint__card:nth-child(12){ animation-delay:.71s; }

html body .ix-igridsec .ix-igrid__card:hover,
html body .ix-iint .ix-iint__card:hover{
	border-color:transparent; box-shadow:0 18px 40px rgba(80,38,158,.16); transform:translateY(-6px);
}

/* --- gradient wipe across the top edge on hover --- */
html body .ix-igridsec .ix-igrid__card::after,
html body .ix-iint .ix-iint__card::after{
	content:""; position:absolute; top:0; left:0; height:3px; width:0;
	background:linear-gradient(90deg,#50269E,#e0559b);
	transition:width .45s cubic-bezier(.22,.9,.3,1);
}
html body .ix-igridsec .ix-igrid__card:hover::after,
html body .ix-iint .ix-iint__card:hover::after{ width:100%; }

/* --- full-card wash. height:auto is load-bearing: without it an inherited height crushes
       this to a 3px strip, which is defect 2 from SITE-CHANGELOG row 380. --- */
html body .ix-igridsec .ix-igrid__card::before,
html body .ix-iint .ix-iint__card::before{
	content:""; position:absolute; inset:0; height:auto;
	background:linear-gradient(135deg,rgba(80,38,158,.06) 0%,rgba(224,85,155,.07) 100%);
	opacity:0; transition:opacity .35s ease; pointer-events:none;
}
html body .ix-igridsec .ix-igrid__card:hover::before,
html body .ix-iint .ix-iint__card:hover::before{ opacity:1; }

/* --- icon tile: lavender tile, purple line glyph. background-color, never the background
       shorthand: family B paints its glyph as a background-image data URI and the shorthand
       would erase it. --- */
html body .ix-igridsec .ix-igrid__ico,
html body .ix-iint .ix-iint__icon{
	position:relative; width:52px; height:52px; border-radius:14px;
	background-color:#f0ebff; background-repeat:no-repeat; background-position:center;
	display:flex; align-items:center; justify-content:center;
	margin:0 auto 16px; box-shadow:none;
	transition:background-color .3s ease, transform .35s cubic-bezier(.22,.9,.3,1), box-shadow .3s ease;
}
html body .ix-igridsec .ix-igrid__ico svg,
html body .ix-iint .ix-iint__icon svg{
	width:24px !important; height:24px !important;   /* !important: several pages hard-code style="width:26px;height:26px" on the svg */
	stroke:#50269E; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
	transition:stroke .3s ease;
}
html body .ix-igridsec .ix-igrid__card:hover .ix-igrid__ico,
html body .ix-iint .ix-iint__card:hover .ix-iint__icon{
	background-color:#ece2ff; transform:translateY(-3px) scale(1.06);
}
/* The pulse rides a dedicated ring, not the tile: an !important box-shadow on the tile
   outranks an animation on the tile and the pulse never plays (row 380, defect 3). */
html body .ix-igridsec .ix-igrid__ico::after,
html body .ix-iint .ix-iint__icon::after{
	content:""; position:absolute; inset:0; border-radius:14px; pointer-events:none;
}
html body .ix-igridsec .ix-igrid__card:hover .ix-igrid__ico::after,
html body .ix-iint .ix-iint__card:hover .ix-iint__icon::after{
	animation:ixIntPulse 1.6s ease-out infinite;
}

/* --- chip inverts to solid purple on hover --- */
html body .ix-igridsec .ix-igrid__chip,
html body .ix-iint .ix-iint__tag{
	display:inline-block; align-self:center; margin:0 0 .9rem; padding:.28rem .75rem;
	background-color:#f2ecfb; border-radius:999px; font-size:.7rem; font-weight:700;
	letter-spacing:.06em; text-transform:uppercase; color:#50269E; line-height:1.3;
	transition:background-color .3s ease, color .3s ease;
}
html body .ix-igridsec .ix-igrid__card:hover .ix-igrid__chip,
html body .ix-iint .ix-iint__card:hover .ix-iint__tag{ background-color:#50269E; color:#fff; }

/* --- type. position:relative keeps the copy above the ::before wash. --- */
html body .ix-igridsec .ix-igrid__card h3,
html body .ix-iint .ix-iint__h3{ position:relative; margin:0 0 .55rem; font-size:1.12rem; line-height:1.3; font-weight:700; color:#14121a; }
html body .ix-igridsec .ix-igrid__card p,
html body .ix-iint .ix-iint__p{ position:relative; margin:0 0 1.15rem; font-size:.95rem; line-height:1.62; color:#4a4756; }
html body .ix-igridsec .ix-igrid__ben,
html body .ix-iint .ix-iint__ben{ position:relative; margin:auto 0 0; padding-top:.9rem; border-top:1px solid #efecf6; font-size:.93rem; line-height:1.5; font-weight:600; color:#50269E; }
html body .ix-igridsec .ix-igrid__card a,
html body .ix-iint .ix-iint__card a{ position:relative; color:#50269E; font-weight:600; }

/* --- Family A adopts family B's exact type and spacing (owner 2026-08-25, comparing
   "The Stack, Wired Into One Order Book" on 912 against "Keep the Tools You Rely On"
   on 923: "the lower part of card in purple color which i like", "also the spacing
   text size etc").

   The two families already share card shell, icon tile and glyph - measured identical.
   They diverged on type only, because family B is also matched by an older !important
   block (~line 3498) that outranks the shared rules above: h3 1.15rem not 1.12, tag
   .72rem not .7, p .96rem/1.1rem not .95rem/1.15rem. Family A had no such override, so
   it rendered a step smaller. These restate B's winning values for A.

   The benefit line is the important one. It was grey on A and purple on B for a reason
   that is pure accident: the generic body rule above is written ".ix-igrid__card p",
   which ends in an element selector (0,2,3) and so outranks ".ix-igrid__ben" (0,2,2) -
   and .ix-igrid__ben IS a <p> inside that card, so the grey won. Family B escaped only
   because its generic rule is ".ix-iint__p", a class, which never matches .ix-iint__ben.
   Qualifying as p.ix-igrid__ben restores the tie and source order settles it here. --- */
html body .ix-igridsec .ix-igrid__card h3{ font-size:1.15rem; margin:0 0 .5rem; line-height:1.3; }
html body .ix-igridsec .ix-igrid__chip{ font-size:.72rem; padding:.28rem .7rem; letter-spacing:.04em; }
html body .ix-igridsec .ix-igrid__card p{ font-size:.96rem; margin:0 0 1.1rem; line-height:1.62; }
html body .ix-igridsec p.ix-igrid__ben{ font-size:.95rem; line-height:1.5; margin:auto 0 0; padding-top:.9rem; color:#50269E; }

/* --- section shell, family A only (family B keeps the .ix-iint shell it already has).
       Lifted from 772 as written: no background or padding is stated here, because those
       pages set their own section background on the block and an override would repaint
       sections that are deliberately white. --- */
html body .ix-igridsec>h2{ max-width:900px; margin:0 auto; text-align:center; padding:0 24px; }
/* 16.5px -> 18px 2026-08-25 (owner: "this line a bit small"). It was the last stray
   fractional size in this component family: every comparable intro on the same page
   renders at 18px (.ix-sec-sub, .ix-iwhat__copy p), so the stack intro read a step
   smaller than the paragraphs above and below it for no reason anyone chose. Same
   correction the mobile type-scale pass made to .ix-ihero__sub (17px -> 18px, the site
   body size). NOTE: the pages carrying this section also declare .ix-igrid__intro at
   16.5px in an inline <style>, but this rule outranks it (html body = 0,2,2 against
   0,1,2), so the size is set here and a page-content edit would change nothing. */
html body .ix-igridsec>.ix-igrid__intro{ max-width:820px; margin:14px auto 0; text-align:center; color:#4a5568; font-size:18px; line-height:1.7; padding:0 24px; }
html body .ix-igridsec>.ix-igrid__more{ text-align:center; max-width:760px; margin:34px auto 0; font-size:16px; color:#4a5568; padding:0 24px; }
html body .ix-igridsec>.ix-igrid__cta{ text-align:center; margin:14px 0 0; }
html body .ix-igridsec .ix-svc__eyebrow{ display:flex; justify-content:center; margin-bottom:2px; }
html body .ix-igridsec .ix-svc__eyebrow .badge-icon{ display:none; }
html body .ix-igridsec .ix-svc__eyebrow .badge-wrapper{ padding-top:0; }
html body .ix-igridsec .ix-svc__spark{ display:flex; justify-content:center; margin-bottom:6px; }
html body .ix-igridsec .ix-svc__spark img{ width:40px; height:auto; display:block; }

@media (prefers-reduced-motion:reduce){
	html body .ix-igridsec .ix-igrid__card,
	html body .ix-iint .ix-iint__card{ opacity:1; animation:none; transition:none; }
	html body .ix-igridsec .ix-igrid__card:hover,
	html body .ix-iint .ix-iint__card:hover{ transform:none; }
	html body .ix-igridsec .ix-igrid__ico,
	html body .ix-iint .ix-iint__icon{ transition:none; }
	html body .ix-igridsec .ix-igrid__card:hover .ix-igrid__ico,
	html body .ix-iint .ix-iint__card:hover .ix-iint__icon{ transform:none; }
	html body .ix-igridsec .ix-igrid__card:hover .ix-igrid__ico::after,
	html body .ix-iint .ix-iint__card:hover .ix-iint__icon::after{ animation:none; }
	html body .ix-igridsec .ix-igrid__card::after,
	html body .ix-iint .ix-iint__card::after{ transition:none; }
	html body .ix-igridsec .ix-igrid__card::before,
	html body .ix-iint .ix-iint__card::before{ transition:none; }
}

/* Icon treatment unified: the 21 legacy-named glyphs get the same tile, size and hover as the v3 set (2026-08-09).
   Two icon systems with zero name overlap were rendering side by side on the same grids (retail, manufacturing and others),
   which is why some icons in a row looked unlike the rest. Glyph art stays per-name; only the presentation is unified. */
.ix-ichal__icon.ix-ico--accounts, .ix-ichal__icon.ix-ico--barcode, .ix-ichal__icon.ix-ico--bin, .ix-ichal__icon.ix-ico--blind, .ix-ichal__icon.ix-ico--blueprint, .ix-ichal__icon.ix-ico--bottleneck, .ix-ichal__icon.ix-ico--cad, .ix-ichal__icon.ix-ico--code, .ix-ichal__icon.ix-ico--edi, .ix-ichal__icon.ix-ico--feed, .ix-ichal__icon.ix-ico--ledger, .ix-ichal__icon.ix-ico--payroll, .ix-ichal__icon.ix-ico--plan, .ix-ichal__icon.ix-ico--plant, .ix-ichal__icon.ix-ico--platform, .ix-ichal__icon.ix-ico--quality, .ix-ichal__icon.ix-ico--shipping, .ix-ichal__icon.ix-ico--swap, .ix-ichal__icon.ix-ico--unlinked, .ix-ichal__icon.ix-ico--vault, .ix-ichal__icon.ix-ico--warehouse{ width:85px !important; height:85px !important; min-width:85px !important; margin:0 auto 18px !important; border-radius:0 !important; background-color:transparent !important; box-shadow:none !important; background-repeat:no-repeat !important; background-position:center !important; background-size:72px 72px !important; transition:transform .28s ease !important; }
.ix-iint__icon.ix-ico--accounts, .ix-iint__icon.ix-ico--barcode, .ix-iint__icon.ix-ico--bin, .ix-iint__icon.ix-ico--blind, .ix-iint__icon.ix-ico--blueprint, .ix-iint__icon.ix-ico--bottleneck, .ix-iint__icon.ix-ico--cad, .ix-iint__icon.ix-ico--code, .ix-iint__icon.ix-ico--edi, .ix-iint__icon.ix-ico--feed, .ix-iint__icon.ix-ico--ledger, .ix-iint__icon.ix-ico--payroll, .ix-iint__icon.ix-ico--plan, .ix-iint__icon.ix-ico--plant, .ix-iint__icon.ix-ico--platform, .ix-iint__icon.ix-ico--quality, .ix-iint__icon.ix-ico--shipping, .ix-iint__icon.ix-ico--swap, .ix-iint__icon.ix-ico--unlinked, .ix-iint__icon.ix-ico--vault, .ix-iint__icon.ix-ico--warehouse{ width:52px !important; height:52px !important; min-width:52px !important; border-radius:14px !important; background-color:#f0ebff !important; background-repeat:no-repeat !important; background-position:center !important; background-size:24px 24px !important; box-shadow:none !important; transition:background-color .28s ease, box-shadow .28s ease !important; }
.ix-ichal__card:hover .ix-ichal__icon.ix-ico--accounts, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--barcode, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--bin, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--blind, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--blueprint, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--bottleneck, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--cad, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--code, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--edi, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--feed, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--ledger, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--payroll, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--plan, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--plant, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--platform, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--quality, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--shipping, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--swap, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--unlinked, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--vault, .ix-ichal__card:hover .ix-ichal__icon.ix-ico--warehouse{ background-color:#ece2ff !important; box-shadow:none !important; }
.ix-iint__card:hover .ix-iint__icon.ix-ico--accounts, .ix-iint__card:hover .ix-iint__icon.ix-ico--barcode, .ix-iint__card:hover .ix-iint__icon.ix-ico--bin, .ix-iint__card:hover .ix-iint__icon.ix-ico--blind, .ix-iint__card:hover .ix-iint__icon.ix-ico--blueprint, .ix-iint__card:hover .ix-iint__icon.ix-ico--bottleneck, .ix-iint__card:hover .ix-iint__icon.ix-ico--cad, .ix-iint__card:hover .ix-iint__icon.ix-ico--code, .ix-iint__card:hover .ix-iint__icon.ix-ico--edi, .ix-iint__card:hover .ix-iint__icon.ix-ico--feed, .ix-iint__card:hover .ix-iint__icon.ix-ico--ledger, .ix-iint__card:hover .ix-iint__icon.ix-ico--payroll, .ix-iint__card:hover .ix-iint__icon.ix-ico--plan, .ix-iint__card:hover .ix-iint__icon.ix-ico--plant, .ix-iint__card:hover .ix-iint__icon.ix-ico--platform, .ix-iint__card:hover .ix-iint__icon.ix-ico--quality, .ix-iint__card:hover .ix-iint__icon.ix-ico--shipping, .ix-iint__card:hover .ix-iint__icon.ix-ico--swap, .ix-iint__card:hover .ix-iint__icon.ix-ico--unlinked, .ix-iint__card:hover .ix-iint__icon.ix-ico--vault, .ix-iint__card:hover .ix-iint__icon.ix-ico--warehouse{ background-color:#ece2ff !important; box-shadow:none !important; }

/* ===== INJECTED MODULE NORMALISATION (2026-08-09) =====================
   ~30 sections across 21 pages were injected via REST months ago as bare
   <section class="ix-mod-*"> with inline styles, so they carry none of the
   site treatment: no band rhythm, no card styling, no hover, no eyebrow.
   Owner: "not carry any style or theme". Inline styles outrank a stylesheet,
   so the overrides below are deliberately !important and scoped tightly to
   the ix-mod- family. Markup keeps its own copy; only presentation changes. */
section[class*="ix-mod-"], section[class*="ix-cmp-"]{ max-width:none !important; margin:0 !important;
  padding:64px 24px 72px !important; background:#faf8ff; }
section[class*="ix-mod-"] + section[class*="ix-mod-"], section[class*="ix-cmp-"] + section[class*="ix-cmp-"]{ background:#fff; }
section[class*="ix-mod-"] > h2, section[class*="ix-cmp-"] > h2{ font-family:var(--wp--preset--font-family--heading) !important;
  font-size:clamp(26px,3.2vw,38px) !important; line-height:1.2 !important; letter-spacing:-.01em;
  text-align:center !important; max-width:900px; margin:0 auto 10px !important; color:#0d1224 !important; }
section[class*="ix-mod-"] > p, section[class*="ix-cmp-"] > p{ text-align:center !important; max-width:720px !important;
  margin:0 auto 28px !important; font-size:16.5px; line-height:1.65; color:#4a5568 !important; }
section[class*="ix-mod-"] > div, section[class*="ix-cmp-"] > div{ max-width:1160px; margin-left:auto !important; margin-right:auto !important; gap:16px !important; }
section[class*="ix-mod-"] .iw-card, section[class*="ix-cmp-"] .iw-card,
section[class*="ix-mod-"] > div:not([class*="eyebrow"]):not([style*="background"]), section[class*="ix-cmp-"] > div > div:not([style*="background"]){ background:#fff !important; border:1px solid #e4ddf5 !important;
  border-radius:14px !important; padding:22px 22px 24px !important;
  transition:transform .28s cubic-bezier(.22,.61,.36,1), box-shadow .28s, border-color .28s; }
section[class*="ix-mod-"] .iw-card:hover, section[class*="ix-cmp-"] .iw-card:hover,
section[class*="ix-mod-"] > div:not([class*="eyebrow"]):not([style*="background"]):hover, section[class*="ix-cmp-"] > div > div:not([style*="background"]):hover{ transform:translateY(-4px);
  box-shadow:0 14px 34px rgba(80,38,158,.12); border-color:#cbb9f0 !important; }
/* A wrapper that CONTAINS cards is a grid, not a card itself (prevents card-in-card). */
section[class*="ix-mod-"] > div:has(> .iw-card), section[class*="ix-cmp-"] > div:has(> .iw-card){
  background:transparent !important; border:0 !important; border-radius:0 !important;
  box-shadow:none !important; padding:0 !important; transform:none !important; }
/* A wrapper whose only job is to scroll a table is not a card either. */
section[class*="ix-mod-"] > div:has(> table), section[class*="ix-cmp-"] > div:has(> table){
  background:transparent !important; border:0 !important; border-radius:0 !important;
  box-shadow:none !important; padding:0 !important; transform:none !important; }
section[class*="ix-mod-"] table, section[class*="ix-cmp-"] table{ width:100%; border-collapse:collapse; }
@media (max-width:781px){ section[class*="ix-mod-"], section[class*="ix-cmp-"]{ padding:44px 18px 48px !important; } }
@media (prefers-reduced-motion: reduce){ section[class*="ix-mod-"] .iw-card, section[class*="ix-cmp-"] .iw-card,
  section[class*="ix-mod-"] > div:not([class*="eyebrow"]):not([style*="background"]), section[class*="ix-cmp-"] > div > div:not([style*="background"]){ transition:none; } }
section[class*="ix-cmp-"] > h2{ text-align:center !important; }

/* ===== FEATURE-TABS MOBILE (2026-08-09) ==============================
   .ix-ftabs__layout was grid-template-columns:330px 1fr with NO mobile
   override, so on a phone the 330px rail forced ~750px of content into a
   390px screen: horizontal scroll, squashed slides, a 120px empty gap from
   the desktop-only tabs-col offset and a -22px overlap. Owner reported the
   ERP cluster "not looking good" on phone; this component is on every ERP
   and industry method section, so the fix is global. Tabs become a
   horizontally scrollable strip above the slide, which is the standard
   mobile pattern for this component. */
@media (max-width:860px){
  .ix-ftabs__layout{ grid-template-columns:1fr !important; gap:18px; }
  .ix-ftabs .tabs-col{ padding-top:0 !important; flex-direction:row; gap:8px;
    overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory;
    padding-bottom:4px; scrollbar-width:none; }
  .ix-ftabs .tabs-col::-webkit-scrollbar{ display:none; }
  .ix-ftabs .tab-btn{ flex:0 0 auto; scroll-snap-align:start; padding:12px 16px;
    border:1px solid #e4ddf5; border-radius:12px; background:#fff; text-align:center; }
  .ix-ftabs .tab-btn .tab-label{ font-size:.92rem; white-space:nowrap; }
  .ix-ftabs .tab-btn .tab-sub{ display:none; }
  .ix-ftabs .slides-outer{ margin-left:0 !important; border-radius:14px; }
}
@media (max-width:480px){
  .ix-ftabs .tab-btn{ padding:10px 13px; }
  .ix-ftabs .tab-btn .tab-label{ font-size:.86rem; }
}

/* ===== FIXED-COLUMN MOBILE GAPS (2026-08-09) ========================
   Audit of every fixed-px grid/flex declaration found four components whose
   desktop column width had no mobile override, so each forced horizontal
   overflow on a phone: the site-wide FOOTER (400px+1fr), the about-page
   locations row (220px+1fr) and CTA (480px+1fr), and the timeline card.
   The footer is on every page, so this affects the whole site on mobile. */
@media (max-width:860px){
  .ix-footer__inner{ grid-template-columns:1fr !important; gap:28px; }
  .ix-aloc__row{ grid-template-columns:1fr !important; gap:14px; text-align:center; }
  .ix-acta__inner{ grid-template-columns:1fr !important; gap:22px; text-align:center; }
  .ix-acta__inner .ix-btn, .ix-acta__inner .wp-block-button{ justify-self:center; }
}

/* ===== FOOTER POLISH (2026-08-09, Usman: "the footer can be presented more esthetically") =====
   Diagnosis: column headings rendered white 18px/400 while links rendered white 15px/500, so heading
   and link carried almost identical visual weight and the whole footer read as one undifferentiated
   block of white text. Fix is hierarchy, not decoration: headings become small, spaced and muted;
   links soften to 78% white and brighten on hover; rhythm tightens. Also adds the missing mobile
   rules for the office cards, brand panel and social row. Colour palette unchanged. */
.ix-fcol h3{ font-size:12.5px !important; font-weight:500 !important; letter-spacing:.09em;
  text-transform:uppercase; color:rgba(206,203,246,.72) !important; margin:0 0 16px !important; }
.ix-fcol a{ font-size:14.5px !important; color:rgba(255,255,255,.78) !important; margin-bottom:11px !important;
  transition:color .2s ease, transform .2s ease; width:fit-content; }
.ix-fcol a:hover{ color:#fff !important; transform:translateX(2px); }
.ix-foffice{ transition:background .25s ease, border-color .25s ease, transform .25s ease; }
.ix-foffice:hover{ background:rgba(255,255,255,.07); border-color:rgba(206,203,246,.34); transform:translateY(-2px); }
.ix-fsocial a{ width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.16); border-radius:50%; color:rgba(255,255,255,.82);
  transition:background .22s ease, border-color .22s ease, color .22s ease, transform .22s ease; }
.ix-fsocial a:hover{ background:#50269E; border-color:#50269E; color:#fff; transform:translateY(-2px); }
.ix-fhr{ margin:34px 0 26px !important; }
.ix-fbar{ font-size:12.5px; }
@media (max-width:860px){
  .ix-foffices{ grid-template-columns:1fr !important; gap:14px; }
  .ix-fbrand{ padding:24px; border-radius:20px; }
  .ix-fsocial{ justify-content:flex-start; flex-wrap:wrap; }
  .ix-footer{ padding:52px 20px 26px; }
}
@media (max-width:600px){
  .ix-fcol h3{ margin:0 0 12px !important; }
  .ix-fcol{ margin-bottom:26px; }
}
@media (prefers-reduced-motion: reduce){
  .ix-fcol a:hover, .ix-foffice:hover, .ix-fsocial a:hover{ transform:none; }
}

/* --- Pastel #17 (2026-08-13) erp-consultant: the closing 'Deeper dives' line sat flush
   against the bottom of the service-card grid (measured gap 0px). Only fires when a
   .ix-sec-sub paragraph directly follows the .ix-svc grid, so no other section moves. */
.ix-services .ix-svc + .ix-sec-sub{ margin-top:34px; }
@media (max-width:700px){ .ix-services .ix-svc + .ix-sec-sub{ margin-top:24px; } }

/* --- In-copy links (2026-08-14). Body links were inheriting the browser default underline,
   which the theme never reset: neither theme.json (it sets link colour only) nor any rule in
   here declared text-decoration for content links. Underline is dropped for the resting state
   and restored on hover/focus so the affordance survives; links stay distinguishable at rest
   by the primary purple against the grey body text. Scoped with :not([class]) so styled links
   (.ix-btn buttons, chips, ix-* component links) keep their own treatment untouched. */
.entry-content p a:not([class]),
.entry-content li a:not([class]){ text-decoration:none; }
.entry-content p a:not([class]):hover,
.entry-content p a:not([class]):focus-visible,
.entry-content li a:not([class]):hover,
.entry-content li a:not([class]):focus-visible{ text-decoration:underline; text-underline-offset:2px; }

/* --- .ix-whyx three-up "why us" cards (2026-08-14). The component's LAYOUT was living in an
   inline <style> block inside /wholesale-distribution/ page content, so the panel polish below
   (html body .ix-whyx, added 08-13) was the only thing any other page inherited: reused on
   /erp-consultant/ the component rendered as a plain stacked block with no grid, no card
   padding and no icon chips. Layout is promoted here so every page using .ix-whyx gets the
   same design from one source. Panel treatment (background/border/radius/max-width) stays in
   the `html body .ix-whyx` rule above and still wins on specificity; these rules only supply
   what was missing. */
/* minmax(min(260px,100%),1fr), not minmax(260px,1fr): a bare 260px floor gives the grid a
   min-content width of 3x260 + gaps = 820px, and because .ix-iwhat__copy is a grid item with the
   default min-width:auto it cannot shrink below that - so at 390px the track blew out to 854px and
   cards 2 and 3 rendered off-screen. min(260px,100%) lets the floor collapse to the container. */
.ix-whyx{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:20px; }
.ix-whyx__c{ border:1px solid #eee9f8; border-radius:16px; padding:24px 22px; text-align:center; }
.ix-whyx__i{ width:48px; height:48px; border-radius:12px; background:#f0ebff; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; }
.ix-whyx__c h3{ font-family:'index happy font',Inter,sans-serif; margin:0 0 8px; font-size:18px; line-height:1.3; }
.ix-whyx__c p{ margin:0; font-size:15px; line-height:1.6; color:#4a5568; }
.ix-whyx__foot{ margin:18px 0 0; font-size:15px; line-height:1.6; color:#4a5568; }
.ix-whyx__foot a{ color:#50269E; font-weight:600; }

/* --- .ix-erpsys: the ERP systems row on /erp-consultant/, reusing the .ix-pband card component
   from the homepage partnerships band. Difference is the artwork: partnerships uses wide brand
   wordmarks, which only exist for Odoo and Sage, so this row uses square brand icons plus the
   system name in the <b> the card already styles. The component's default img height of 26px is
   tuned for wordmarks and leaves a square mark looking undersized in a 190px card, so icons get
   40px here. Cards are non-clickable (--static) and carry no partnership implication: the row
   states which systems we select between, and the accompanying copy keeps the Odoo partnership
   explicit and separate. */
.ix-erpsys .ix-pband__card b{ text-align:center; line-height:1.3; }
.ix-pband__lead--foot{ margin-top:26px; }
/* .ix-pband--wide: the band was authored for the homepage at 1120px, which leaves it ~78px
   narrower than the 1200px content width the erp-* pages use, so it reads as inset against
   the sections above and below it. This modifier lifts only the erp-systems usage to the page
   standard; the homepage band keeps its original 1120px. */
.ix-pband--wide .ix-pband__in{ max-width:1200px; }

/* --- 1. Stop .ix-iwhat media distorting (2026-08-14). .ix-iwhat__media is align-self:stretch and
   its img is height:100% + object-fit:cover, so the photo is forced to whatever height the copy
   column happens to be. On /erp-consultant/ the explainer section carries the longest copy on the
   page and a 2016x1344 (1.50) source was being rendered into a 529x823 box - an aspect of 0.64,
   i.e. a landscape scene cropped to a tall sliver. Images now keep their natural proportions and
   centre against the copy; max-height guards a very tall portrait source. The <=900px rules below
   already did the right thing, so this only changes desktop. */
/* REVERTED 2026-08-14: natural-aspect images left a short photo beside a tall copy column,
   which read worse than the crop it fixed. Media returns to align-self:stretch + height:100%
   from the base rules above. The underlying issue stands - a landscape source in a very tall
   column still crops hard - but the fix has to keep the column filled, not shorten the image. */

/* --- 3. Section rhythm. Most sections run 70px top and bottom; these two drifted (the merged
   pband band at 56/60, the why band at 70/78) which made the scroll feel uneven. The homepage
   pband keeps its own 56/60 - only the erp-* usage is normalised.
   The .ix-iwhy half of this pair used to live here too, and being a later `html body` rule of
   equal specificity it silently beat the max-width:600px mobile rule above - the why band was
   still painting 70/70 on a phone. Its 78px bottom is now trimmed at the original declaration
   instead, so the mobile step survives. Same trap applies to --wide, which had no mobile step
   at all and rendered 70/70 down to 320px; it gets one below. */
.ix-pband--wide{ padding:70px 24px; }
@media (max-width:600px){ .ix-pband--wide{ padding:48px 16px; } }

/* --- Bring the --wide band's type in line with the page. The band inherits homepage values
   (32px/700 heading, 15.5px lead capped at 700px) which read as a secondary treatment there,
   but on the erp-* pages it is a full section sitting between 40px/600 headings and 18px subs,
   so it looked like it belonged to a different page. Matches .ix-sec-title / .ix-sec-sub here
   only, with the same 900/480 steps so it tracks them responsively. The intro lead takes the
   760px measure of .ix-sec-sub; the closing paragraph is a long argument and gets 860px so it
   does not stack into a narrow column. Homepage band keeps its original scale. */
.ix-pband--wide .ix-pband__h{ font-size:40px; font-weight:600; line-height:1.15; }
.ix-pband--wide .ix-pband__lead{ font-size:18px; line-height:1.55; max-width:760px; }
.ix-pband--wide .ix-pband__lead--foot{ max-width:860px; }
@media (max-width:900px){ .ix-pband--wide .ix-pband__h{ font-size:2rem; } }
@media (max-width:480px){ .ix-pband--wide .ix-pband__h{ font-size:1.7rem; } }

/* ============================================================
   Mobile heading ladder for the two carousel components (2026-08-14).
   .ix-sec-title is the reference ladder: 40px -> 2rem at 900px -> 1.7rem at 480px.
   .ix-iwhat__title and .ix-pband--wide .ix-pband__h already track it. The two
   carousels did not: .ix-ftabs__title stepped 2rem at 1100px then 1.5rem at 640px,
   bottoming out at 24px, and .ix-iccar__title stepped once at 1100px and stayed
   32px all the way down. Measured at 390px that put three different heading sizes
   on one page - 24px, 27.2px and 32px. Both now finish on 1.7rem like everything
   else. The 1100px step stays where it is for both: that is where each component
   goes full-bleed, so its type has to shift there anyway.
   ============================================================ */
@media (max-width:480px){
	.ix-ftabs__title, .ix-iccar__title{ font-size:1.7rem; }
}

/* ============================================================
   Service hero, mobile treatment (2026-08-14). Waqas asked for the homepage's
   centred hero and for both buttons to stay on one row.

   Centring applies from 900px, which is where .ix-ihero__grid collapses to a
   single column - above that the hero is a two-column layout where left-aligned
   copy is correct. Scoped to --svc so split-hero.php keeps its own treatment.

   The buttons were stacking not because of the labels alone but because
   .ix-ihero__btn carries 28px of side padding (56px total) at every width: in a
   172px mobile button that leaves 116px for text, so "Book a free workflow
   review" (204px) wrapped to three lines and the pair could never share a row.
   Padding drops to 18px below 600px and the hero label is now "Talk to an
   expert" (121px in the button font), so the row measures 157 + 132 + 14 = 303px
   against 354px available at 390px and 324px at 360px - one row, one line each,
   on every common phone. It still wraps to a stack at 320px, which is correct.
   The body CTA in the cost section keeps "Book a free workflow review": it is a
   full-width text link with room for the specific promise.
   ============================================================ */
@media (max-width:900px){
	.ix-ihero--svc .ix-ihero__copy{ text-align:center; }
	.ix-ihero--svc .ix-ihero__sub{ margin-left:auto; margin-right:auto; }
	.ix-ihero--svc .ix-ihero__actions{ justify-content:center; }
}
@media (max-width:600px){
	.ix-ihero--svc .ix-ihero__btn{ padding:0 18px; }
}

/* ============================================================
   Mobile: centre the stacked text sections, tighten the warning-signs rhythm
   (2026-08-14, Waqas).

   CENTRING. The homepage is centred throughout - every H2 and the body copy in
   nine of its ten sections - so a left-aligned column is the exception on this
   site, not the rule. .ix-iwhat was the only section family still reading left
   on a phone, on all three of its uses (the ERP explainer, why-us, and cost).
   Applied from 900px, where .ix-iwhat__grid collapses to one column: above that
   it is a genuine two-column image + text layout and left-aligned copy is right.
   Deliberately NOT centred: .ix-ifaq answers and the .ix-ftabs slide copy. Both
   are long-form with bullet lists, where a centred ragged left edge hurts to
   read, and neither has a homepage counterpart to imitate.

   WARNING SIGNS. The card grid kept desktop metrics on mobile: a 44px row gap
   between stacked cards, 50px under the heading, 24px card padding and an 85px
   icon. Six cards at those numbers made the section 2603px tall - about seven
   phone screens. The homepage's own card grids run an 18px gap, which is what
   the row gap becomes here. Card text is left at 18px for now; the homepage
   equivalent is 15.5px, but that is a type decision rather than a spacing one.
   ============================================================ */
@media (max-width:900px){
	.ix-iwhat__copy{ text-align:center; }

	.ix-ichal .ix-sec-title{ margin-bottom:24px; }
	.ix-ichal__sub{ margin-bottom:24px; }
	.ix-ichal__grid{ gap:18px; }
	.ix-ichal__card{ padding:16px 20px; }
	.ix-ichal__icon{ width:60px; height:60px; margin-bottom:12px; }
	.ix-ichal__icon svg{ width:52px; height:52px; }
}

/* ============================================================
   Mobile type scale (2026-08-14, Waqas: "keep our standard maintained").
   Audited every VISIBLE text element on /erp-consultant/ at 390px - the first
   pass counted .tab-label and .tab-sub as strays, but .ix-ftabs .tabs-col is
   display:none below 1100px, so those two never render on a phone and are not
   part of the mobile picture.

   What was already uniform and is untouched: section headings at 27.2px x11,
   body copy at 18px x21, buttons 16px/600, eyebrows 14px/600.

   The strays were all rem values chosen per component rather than from a scale,
   which is why they landed on fractional pixels nobody picked on purpose:
     .ix-ihero__sub        1.06rem  = 17px    -> 18px    (site body size)
     .ix-indcard__name     1.02rem  = 16.3px  -> 16px
     .ix-ftabs .slide-desc  .93rem  = 14.9px  -> 15px
     .ix-ftabs .prod-name   .88rem  = 14.1px  -> 14px
     .ix-pband__card b               13.5px   -> 14px
     .ix-ftabs .prod-desc    .8rem  = 12.8px  -> 12.5px
   Changed at the declaration rather than overridden here, so the scale is fixed
   at source. slide-desc / prod-name / prod-desc keep three distinct steps
   (15 / 14 / 12.5) because they are body, label and fine print inside the same
   card - collapsing them would flatten a hierarchy that is doing real work.

   .ix-htrust__stats b went to 30px/800 to match the homepage's own stat
   figures (.ix-proofdeck__cnt, .ix-pstat__n). The 27px I had used sat 0.2px
   from the 27.2px section headings - visually the same size as a section
   heading while being a different declaration, which is the worst of both.
   ============================================================ */

/* ============================================================
   Why-us band, desktop proportions (2026-08-14). Regression report from Waqas:
   "why choose index world is changed, currently it is large image, I want it
   back" - desktop only, mobile fine. He was right, and it was my off-screen-card
   fix that did it.

   Before that fix .ix-whyx had a hard 260px track floor, giving the grid a
   min-content of 3x260 + gaps = 820px. .ix-iwhat__copy is a grid item with the
   default min-width:auto, so it could not shrink below 820px and simply took the
   space from the media column. That accident WAS the design: media 265px, copy
   847px, three cards on one row, band 630px tall. Collapsing the floor so the
   cards could stack on a phone also removed the force holding the columns apart,
   and the band fell back to its declared 1fr / 1.1fr - media 529px, copy 582px,
   cards 2-up, band 972px. Twice the image, 342px taller.

   The proportions are now declared instead of emergent: 1fr / 3.2fr above 900px
   reproduces the original render exactly (measured: media 265x495, copy 847x495,
   3 cards, 630px). The track floor also drops 260px -> 240px, because at 260 the
   card count sat on a knife edge - 847px of copy gave three cards and 834px gave
   two, so a 13px shift in container width silently changed the layout. At 240
   there is ~20px of headroom.
   ============================================================ */
@media (min-width:901px){
	.ix-iwhy .ix-iwhat__grid{ grid-template-columns:minmax(0,1fr) minmax(0,3.2fr); }
}

/* ============================================================
   .ix-iwhat media: the image must never drive the row height (2026-08-14).
   Reported on /erp-implementation/ as "the image size is bigger than text".
   It was, by 248px: the cost section pairs a 1600x2400 PORTRAIT source with a
   529px-wide column, so the image's intrinsic height is 794px against 546px of
   copy. The image won the row, and with align-items:center the text floated in
   the middle with 124px of dead space above and below it.

   It is a component bug, not a copy-length one, and it only shows when a
   portrait source lands in a WIDE column: the same page's explainer (landscape
   2016x1344) and its why-us band (portrait, but a 265px column) both sit at a
   gap of 0. Trimming copy would have made this instance worse, not better.

   Taking the image out of flow removes it from the row-height calculation, so
   the copy defines the row and the media stretches to match it. min-height moves
   to the media box, which is now the element that owns the height. Scoped to
   >=901px: below that the grid stacks and .ix-iwhat__media img already switches
   to height:auto with a 4/3 aspect-ratio, which must keep working.
   ============================================================ */
@media (min-width:901px){
	.ix-iwhat__media{ position:relative; min-height:360px; }
	.ix-iwhat__media img{ position:absolute; inset:0; width:100%; height:100%; min-height:0; object-fit:cover; }
}

/* --- Post byline (2026-08-14). Renders from inc/authors.php, not the WP user row. --- */
.ix-byline{background:#F8F6FD;border:1px solid #ece7f8;border-radius:14px;padding:16px 20px 15px;margin:0 0 34px}
.ix-byline__row{display:flex;align-items:center;justify-content:space-between;gap:24px}
.ix-byline__who{display:flex;align-items:center;gap:14px;min-width:0}
.ix-byline__av{flex:0 0 50px;width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:17px;box-shadow:0 0 0 3px #fff,0 0 0 4px #e7dffa}
.ix-byline__txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.ix-byline__name{display:inline-flex;align-items:center;gap:6px;font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:17px;color:#50269E;text-decoration:none;line-height:1.2;border-bottom:1px solid #d9cdf5;padding-bottom:1px}
.ix-byline__name:hover{border-bottom-color:#50269E}
.ix-byline__name svg{color:#b7a6e4;transition:transform .15s,color .15s}
.ix-byline__name:hover svg{color:#50269E;transform:translateX(2px)}
.ix-byline__role{font-family:'AlmadenSans para',Inter,sans-serif;font-size:14.5px;line-height:1.35;color:#5a5a6a}
.ix-byline__role i{font-style:normal;color:#c3b8e2;padding:0 3px}
.ix-byline__dates{display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-family:'AlmadenSans para',Inter,sans-serif;font-size:13px;color:#7d7789;white-space:nowrap}
.ix-byline__review{display:inline-flex;align-items:center;gap:8px;margin-top:14px;background:#fff;border:1px solid #e4dcfa;border-radius:20px;padding:7px 15px 7px 11px;font-family:'AlmadenSans para',Inter,sans-serif;font-size:13.5px;color:#3f3a52}
.ix-byline__review b{font-weight:600;color:#50269E}
.ix-byline__check{width:19px;height:19px;border-radius:50%;background:#50269E;color:#fff;display:inline-flex;align-items:center;justify-content:center;flex:0 0 19px}
@media (max-width:640px){
  .ix-byline__row{flex-direction:column;align-items:flex-start;gap:12px}
  .ix-byline__dates{align-items:flex-start;flex-direction:row;gap:14px;flex-wrap:wrap}
}

/* --- Author hub /authors/ (2026-08-20, visual pass 2). Hero band + card grid. --- */
.ix-authp__hero{padding:92px 24px 78px;background:radial-gradient(120% 130% at 8% 0%,#EFE9FF 0%,#F6F3FE 42%,#FBFAFF 72%,#fff 100%)}
.ix-authp__in{max-width:1080px;margin:0 auto}
.ix-authp__h1{font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:3.5rem;line-height:1.06;letter-spacing:-.018em;color:#0d1224;margin:0 0 20px}
.ix-authp__lede{font-family:'AlmadenSans para',Inter,sans-serif;font-size:1.2rem;line-height:1.66;color:#4a4560;margin:0;max-width:640px}
.ix-authp__body{background:#F7F5FC;border-top:1px solid #efeaf9;padding:56px 24px 88px}
.ix-auth{background:#fff;border:1px solid #ece7f8;border-radius:18px;padding:26px 28px 28px;scroll-margin-top:96px;transition:border-color .16s,box-shadow .16s;display:flex;flex-direction:column}
.ix-auth:hover{border-color:#d6c8f4;box-shadow:0 8px 26px rgba(63,29,134,.08)}
.ix-auth__av{border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-family:'index happy font',Inter,sans-serif;font-weight:600;letter-spacing:.02em;flex:0 0 auto}
/* One gradient per person, keyed by slug so the profile card, the byline and the
   author box all render the same colour for the same person regardless of order. */
/* Headshot variant. The gradient stays underneath as the loading placeholder. */
.ix-av--photo{object-fit:cover;object-position:center top;display:block;padding:0;border:0}
/* LinkedIn brand mark. Stays LinkedIn Blue rather than inheriting the pill's purple:
   their brand guidelines allow the bug for linking to a profile, but not recoloured. */
.ix-li-mark{flex:0 0 auto;border-radius:3px}
.ix-auth__li:hover .ix-li-mark,.ix-abox__link:hover .ix-li-mark{opacity:.85}
.ix-av--waqas-yousaf{background:linear-gradient(145deg,#7a4ad0,#3d1a86 58%,#3d1a86)}
.ix-av--umer-younas{background:linear-gradient(145deg,#5a54e0,#2a2a8f 58%,#2a2a8f)}
.ix-av--muhammad-ibraheem{background:linear-gradient(145deg,#a544c0,#5c1c72 58%,#5c1c72)}
.ix-av--ali-zameer{background:linear-gradient(145deg,#6b3ccc,#33157a 58%,#33157a)}
.ix-av--nouman-farooq{background:linear-gradient(145deg,#4f63d8,#24327f 58%,#24327f)}
.ix-av--soban-butt{background:linear-gradient(145deg,#9247b8,#4e1f6b 58%,#4e1f6b)}
.ix-av--muhammad-abdullah{background:linear-gradient(145deg,#4a3ad0,#221a6e 58%,#221a6e)}
.ix-auth--lead{display:grid;grid-template-columns:118px minmax(0,1fr) 330px;gap:34px;align-items:start;padding:32px 34px 34px;margin-bottom:20px}
.ix-auth--lead .ix-auth__id{display:flex;flex-direction:column;align-items:center;gap:14px}
.ix-auth--lead .ix-auth__av{width:96px;height:96px;font-size:30px;box-shadow:0 0 0 4px #fff,0 0 0 5px #e4dcfa}
.ix-auth--lead .ix-auth__name{font-size:1.85rem;margin:2px 0 7px}
.ix-auth--lead .ix-auth__role{margin-bottom:14px}
.ix-auth--lead .ix-auth__bio{font-size:1.06rem}
.ix-auth--lead .ix-auth__work{margin-top:4px;margin-bottom:0;padding-top:0;border-top:0;border-left:1px solid #f0ebfa;padding-left:30px}
.ix-auth--lead .ix-auth__li{margin-top:0}
.ix-authp__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ix-auth__top{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.ix-auth__top .ix-auth__av{width:60px;height:60px;font-size:20px;box-shadow:0 0 0 3px #fff,0 0 0 4px #ece4fb}
.ix-auth__hd{min-width:0}
.ix-auth__name{font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:1.24rem;line-height:1.2;color:#0d1224;margin:0 0 4px}
.ix-auth__role{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.9rem;line-height:1.3;color:#50269E;font-weight:600;margin:0}
.ix-auth__role i{font-style:normal;color:#c3b8e2;padding:0 5px;font-weight:400}
.ix-auth__cred{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.86rem;line-height:1.35;color:#7d7789;margin:3px 0 0}
.ix-auth__bio{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.98rem;line-height:1.7;color:#43404f;margin:0}
.ix-auth__skills{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;padding:0}
.ix-auth__skills li{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.75rem;font-weight:600;line-height:1.35;color:#63539a;background:#F4F0FF;border:1px solid #e7dffa;border-radius:6px;padding:3px 9px}
.ix-auth--lead .ix-auth__skills{margin:0 0 16px}
.ix-auth__work{margin-top:18px;margin-bottom:18px;padding-top:16px;border-top:1px solid #f2eefb}
.ix-auth__wh{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#a099b4;margin:0 0 9px}
.ix-auth__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ix-auth__list a{display:block;font-family:'AlmadenSans para',Inter,sans-serif;font-size:.94rem;line-height:1.5;color:#2a2740;text-decoration:none}
.ix-auth__list a:hover{color:#50269E}
.ix-auth__nb{white-space:nowrap}
.ix-auth__arr{color:#cec2ec;display:inline-block;vertical-align:-1px;margin-left:7px;transition:transform .15s,color .15s}
.ix-auth__list a:hover .ix-auth__arr{color:#50269E;transform:translateX(3px)}
.ix-auth__li{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;margin-top:auto;font-family:'AlmadenSans para',Inter,sans-serif;font-size:.82rem;font-weight:600;color:#50269E;text-decoration:none;border:1px solid #e4dcfa;background:#F7F4FF;border-radius:20px;padding:5px 14px}
.ix-auth__li:hover{background:#ECE6FF;border-color:#cbb9f0}
.ix-authp__how{margin-top:26px;background:#fff;border:1px solid #ece7f8;border-radius:18px;padding:32px 34px}
.ix-authp__hh{font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:1.3rem;color:#0d1224;margin:0 0 20px}
.ix-authp__rules{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.ix-authp__rules li{display:flex;gap:12px;font-family:'AlmadenSans para',Inter,sans-serif;font-size:.95rem;line-height:1.62;color:#43404f}
.ix-authp__rules b{font-weight:600;color:#16182b;display:block;margin-bottom:3px}
.ix-authp__chk{flex:0 0 20px;width:20px;height:20px;margin-top:2px;border-radius:50%;background:#50269E;color:#fff;display:inline-flex;align-items:center;justify-content:center}
.ix-authp__foot{margin:26px 0 0;font-family:'AlmadenSans para',Inter,sans-serif;font-size:.96rem;line-height:1.7;color:#6b6684}
.ix-authp__foot a{color:#50269E;font-weight:600;text-decoration:none;border-bottom:1px solid #d9cdf5}
.ix-authp__foot a:hover{border-bottom-color:#50269E}
@media (max-width:980px){
  .ix-auth--lead{grid-template-columns:96px minmax(0,1fr);gap:24px}
  .ix-auth--lead .ix-auth__work{grid-column:1 / -1;border-left:0;padding-left:0;padding-top:16px;border-top:1px solid #f2eefb;margin-top:14px}
  .ix-authp__grid{grid-template-columns:1fr}
  .ix-authp__rules{grid-template-columns:1fr;gap:16px}
}
@media (max-width:720px){
  .ix-authp__hero{padding:52px 20px 40px}
  .ix-authp__h1{font-size:2.25rem}
  .ix-authp__lede{font-size:1.05rem}
  .ix-authp__body{padding:32px 20px 56px}
  .ix-auth{padding:22px 20px 24px;border-radius:15px}
  .ix-auth--lead{grid-template-columns:1fr;padding:24px 20px 26px}
  .ix-auth--lead .ix-auth__id{flex-direction:row;align-items:center;justify-content:flex-start;gap:16px}
  .ix-auth--lead .ix-auth__av{width:68px;height:68px;font-size:22px}
  .ix-auth--lead .ix-auth__name{font-size:1.4rem}
  .ix-authp__how{padding:24px 20px}
}

/* --- End-of-post author box (2026-08-21). The byline says who; this says why it matters. --- */
.ix-abox{display:grid;grid-template-columns:78px minmax(0,1fr);gap:22px;background:#F8F6FD;border:1px solid #ece7f8;border-radius:18px;padding:26px 28px;margin:46px 0 0}
.ix-abox__av{width:78px;height:78px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:25px;box-shadow:0 0 0 4px #fff,0 0 0 5px #e7dffa}
.ix-abox__kick{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#a099b4;margin:0 0 6px}
.ix-abox__name{font-family:'index happy font',Inter,sans-serif;font-weight:600;font-size:1.3rem;line-height:1.2;margin:0 0 4px}
.ix-abox__name a{color:#0d1224;text-decoration:none}
.ix-abox__name a:hover{color:#50269E}
.ix-abox__role{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.92rem;line-height:1.35;color:#50269E;font-weight:600;margin:0 0 12px}
.ix-abox__role i{font-style:normal;color:#c3b8e2;padding:0 5px;font-weight:400}
.ix-abox__bio{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.97rem;line-height:1.7;color:#43404f;margin:0 0 16px}
.ix-abox__links{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ix-abox__link{display:inline-flex;align-items:center;gap:7px;font-family:'AlmadenSans para',Inter,sans-serif;font-size:.85rem;font-weight:600;color:#50269E;text-decoration:none;border:1px solid #e4dcfa;background:#fff;border-radius:20px;padding:6px 15px}
.ix-abox__link:hover{background:#F4F0FF;border-color:#cbb9f0}
.ix-abox__link svg{transition:transform .15s}
.ix-abox__link:hover svg{transform:translateX(2px)}
.ix-abox__rev{font-family:'AlmadenSans para',Inter,sans-serif;font-size:.85rem;line-height:1.5;color:#7d7789;margin:14px 0 0;display:flex;align-items:center;gap:8px}
.ix-abox__rev b{font-weight:600;color:#4a4560}
.ix-abox__rev .ix-byline__check{flex:0 0 18px;width:18px;height:18px}
@media (max-width:640px){
  .ix-abox{grid-template-columns:1fr;gap:16px;padding:22px 20px}
  .ix-abox__av{width:62px;height:62px;font-size:20px}
}


/* --- .ix-iadv / .ix-adv "Advanced solutions" accordion (2026-08-26).
   The whole component's design was living in WordPress Custom CSS scoped to `.page-id-923`
   (/wholesale-distribution/). That page no longer carries the component: the only page using
   it is /aviation-erp-software/ (id 1189), where none of the rules matched, so the section
   rendered as raw markup -- .ix-adv__grid computed display:block instead of a 3-up grid, the
   cards had no background, border or radius, and every <details> body sat permanently open
   with no chevron and no purple open state. Owner, 2026-08-26: "Advanced solutions section is
   not good style."
   Re-scoped to the component (.ix-iadv) rather than a page id, so it travels with the markup.
   Same failure the .ix-whyx promotion fixed on 2026-08-14: layout parked in a page-scoped
   block, then the component reused somewhere the scope did not reach. The !important flags are
   carried over as authored -- they were fighting block-editor defaults on <details>/<summary>,
   not this stylesheet. The Custom CSS copy is now dead and should be deleted from the
   Customizer; leaving it costs nothing but confuses the next reader. */
.ix-iadv .ix-adv__grid{ display:grid !important; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem; align-items:start; }
@media (max-width:960px){ .ix-iadv .ix-adv__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .ix-iadv .ix-adv__grid{ grid-template-columns:1fr; } }
.ix-iadv .ix-adv__card{ background:#fff; border:1px solid #e5e1ef; border-radius:12px; overflow:hidden; transition:box-shadow .2s ease,border-color .2s ease; }
.ix-iadv .ix-adv__card:hover{ border-color:#c9bce6; box-shadow:0 8px 24px rgba(80,38,158,.09); }
.ix-iadv .ix-adv__head{ display:flex !important; align-items:center; gap:.8rem; padding:1.15rem 1.25rem; cursor:pointer; list-style:none !important; min-height:4.25rem; margin:0; }
.ix-iadv .ix-adv__head::-webkit-details-marker{ display:none !important; }
.ix-iadv .ix-adv__head::marker{ content:"" !important; }
.ix-iadv .ix-adv__icon{ flex:0 0 auto; width:26px; height:26px; background-repeat:no-repeat; background-position:center; background-size:26px 26px; }
.ix-iadv .ix-adv__title{ flex:1 1 auto; font-weight:700; font-size:1rem; line-height:1.35; color:#14121a; text-align:left; }
.ix-iadv .ix-adv__chev{ flex:0 0 auto; width:9px; height:9px; border-right:2px solid #50269E; border-bottom:2px solid #50269E; transform:rotate(45deg); transition:transform .2s ease; margin-bottom:4px; }
.ix-iadv .ix-adv__card[open]{ grid-column:1 / -1; border-color:#50269E; box-shadow:0 12px 32px rgba(80,38,158,.12); }
.ix-iadv .ix-adv__card[open] .ix-adv__head{ background:#50269E; }
.ix-iadv .ix-adv__card[open] .ix-adv__title{ color:#fff; }
.ix-iadv .ix-adv__card[open] .ix-adv__icon{ filter:brightness(0) invert(1); }
.ix-iadv .ix-adv__card[open] .ix-adv__chev{ border-color:#fff; transform:rotate(-135deg); margin-bottom:-4px; }
.ix-iadv .ix-adv__body{ display:grid !important; grid-template-columns:repeat(3,1fr); gap:1.5rem; padding:1.6rem 1.5rem; text-align:left; }
@media (max-width:960px){ .ix-iadv .ix-adv__body{ grid-template-columns:1fr; gap:1.1rem; } }
.ix-iadv .ix-adv__body p{ margin:0 !important; font-size:.95rem !important; line-height:1.65 !important; color:#33303d; padding-left:.9rem; border-left:2px solid #ece8f5; text-align:left; }
.ix-iadv .ix-adv__lbl{ display:block !important; font-size:.68rem !important; font-weight:700 !important; letter-spacing:.1em !important; text-transform:uppercase !important; color:#6b6478 !important; margin-bottom:.35rem !important; line-height:1.4 !important; }
.ix-iadv .ix-adv__ben{ border-left-color:#50269E !important; }
.ix-iadv .ix-adv__ben .ix-adv__lbl{ color:#50269E !important; }
.ix-iadv .ix-adv__card:nth-child(1) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h9a2 2 0 0 0 2-2v-6'/%3E%3Cpath d='M8 8h5'/%3E%3Cpath d='M8 12h3'/%3E%3Cpath d='M15 7l6-3-3 6-1.4-1.6z'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(2) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7V5a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M17 3h2a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M21 17v2a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M7 21H5a2 2 0 0 1-2-2v-2'/%3E%3Cpath d='M7 8v8'/%3E%3Cpath d='M10.5 8v8'/%3E%3Cpath d='M14 8v8'/%3E%3Cpath d='M17 8v8'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(3) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='16' width='18' height='5' rx='1'/%3E%3Cpath d='M12 3v9'/%3E%3Cpath d='M8.5 8.5L12 12l3.5-3.5'/%3E%3Cpath d='M7 3h3'/%3E%3Cpath d='M14 3h3'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(4) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8.5 15.5l7-7'/%3E%3Ccircle cx='9.2' cy='9.2' r='1.4'/%3E%3Ccircle cx='14.8' cy='14.8' r='1.4'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(5) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5l7.5 3v5.7c0 4.6-3.1 8.7-7.5 9.8-4.4-1.1-7.5-5.2-7.5-9.8V5.5z'/%3E%3Cpath d='M8.8 11.8l2.2 2.2 4.2-4.2'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(6) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a7.5 7.5 0 0 1-7.5 7.5H8L4 22v-4.4A7.5 7.5 0 0 1 8.5 4.5h5A7.5 7.5 0 0 1 21 12z'/%3E%3Cpath d='M12 8l.9 2.1L15 11l-2.1.9L12 14l-.9-2.1L9 11l2.1-.9z'/%3E%3C/svg%3E"); }
.ix-iadv .ix-adv__card:nth-child(7) .ix-adv__icon{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2350269E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Crect x='7.5' y='6.5' width='9' height='3.5' rx='.5'/%3E%3Cpath d='M8 14h.01'/%3E%3Cpath d='M12 14h.01'/%3E%3Cpath d='M16 14h.01'/%3E%3Cpath d='M8 17.5h.01'/%3E%3Cpath d='M12 17.5h.01'/%3E%3Cpath d='M16 17.5h.01'/%3E%3C/svg%3E"); }

/* ---------------------------------------------------------------
 * Floating WhatsApp button (sitewide)
 * z-index sits BELOW the mobile drawer (.ixm-backdrop 9998 /
 * .ixm-overlay 9999) so it never floats over an open menu.
 * ------------------------------------------------------------- */
.ix-wafab{ position:fixed; right:20px; bottom:20px;
  right:max(20px, env(safe-area-inset-right)); bottom:max(20px, env(safe-area-inset-bottom));
  z-index:900; width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; text-decoration:none;
  box-shadow:0 6px 20px rgba(0,0,0,.22); transition:transform .18s ease, box-shadow .18s ease; }
.ix-wafab:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,.28); }
.ix-wafab:focus-visible{ outline:3px solid #0d1224; outline-offset:3px; }
@media (max-width:768px){
  .ix-wafab{ width:52px; height:52px; right:16px; bottom:16px;
    right:max(16px, env(safe-area-inset-right)); bottom:max(16px, env(safe-area-inset-bottom)); }
  .ix-wafab svg{ width:27px; height:27px; }
}
@media (prefers-reduced-motion:reduce){ .ix-wafab{ transition:none; } .ix-wafab:hover{ transform:none; } }
@media print{ .ix-wafab{ display:none; } }

/* ===== SUPPORT PAGE ADDITIONS (2026-09-11 queue, shipped 2026-09-15) ===== */

/* Support page: second proof row under the stats band (150+ / 100+ / 2018 / 5.0), same tile styling. */
.ix-pstats--proof{ margin-top:14px; }

/* Support page: response-time line on each plan card, the figure that was buried as the last bullet. */
.ix-sup-plan__rt{ margin:10px 0 14px; padding:7px 10px; border-radius:8px; background:#f0ebff; color:#50269E; font-weight:700; font-size:14px; text-align:center; }

/* Support page: versions and editions band (compact, two-column, version strip). */
.ix-sup-versions{ padding:56px 24px; background:#fff; }
.ix-sup-versions__inner{ max-width:1120px; margin:0 auto; display:grid; grid-template-columns:5fr 7fr; gap:48px; align-items:center; }
.ix-sup-versions h2{ font-family:'index happy font',Inter,sans-serif; font-size:30px; line-height:1.15; margin:0 0 10px; color:#0d1224; font-weight:600; }
.ix-sup-versions p{ font-size:16.5px; line-height:1.6; color:#4a5568; margin:0 0 14px; }
.ix-sup-versions p.small{ font-size:15px; margin:0; }
.ix-sup-versions a{ color:#50269E; }
.ix-sup-versions__panel{ background:#f7f7fb; border-radius:20px; padding:26px 28px; }
.ix-sup-versions__strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.ix-sup-versions__v{ display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.ix-sup-versions__n{ background:#50269E; color:#fff; border-radius:12px; padding:12px 0; width:100%; text-align:center; font-family:'index happy font',Inter,sans-serif; font-size:22px; line-height:1; }
.ix-sup-versions__n--legacy{ background:#fff; color:#50269E; border:2px solid #50269E; padding:10px 0; }
.ix-sup-versions__v span{ font-size:12.5px; color:#4a5568; text-align:center; line-height:1.3; }
.ix-sup-versions__eds{ display:grid; grid-template-columns:1fr 1fr; gap:10px 22px; border-top:1px solid #e8eaf0; padding-top:16px; }
.ix-sup-versions__ed{ display:flex; gap:10px; font-size:14.5px; line-height:1.5; color:#0d1224; }
.ix-sup-versions__ed svg{ flex:0 0 16px; margin-top:4px; }
@media (max-width:900px){ .ix-sup-versions__inner{ grid-template-columns:1fr; gap:26px; } .ix-sup-versions__eds{ grid-template-columns:1fr; } }
@media (max-width:560px){ .ix-sup-versions{ padding:44px 20px; } .ix-sup-versions__strip{ grid-template-columns:repeat(2,1fr); } .ix-sup-versions h2{ font-size:26px; } .ix-sup-versions__panel{ padding:20px; } }

/* 2026-09-25: explicit aspect-ratio on lazy images. They already carry matching width/height
   attributes and fixed CSS boxes (no real CLS), but Chrome's Issues panel flags every
   loading=lazy image that lacks an explicit CSS aspect-ratio. Each ratio below equals the
   image's own width/height, so nothing resizes; it only makes the ratio explicit so the
   "Lazy-loaded images should have explicit dimensions" advisory clears. */
.ix-cstory__media > img{ aspect-ratio:825/1024; }
.ix-rw__rate > img{ aspect-ratio:20/20; }
.ix-rw__src > img{ aspect-ratio:16/16; }
.ix-panel-body .ix-preview > img{ aspect-ratio:600/360; }
.wp-block-site-logo img.custom-logo{ aspect-ratio:165/40; }
.ix-fbrand > img.ix-fbrand__logo{ aspect-ratio:215/64; }
.ixm-header-title > img{ aspect-ratio:725/176; }
/* brand/partner logo rows: each logo has its own ratio, so match per image (order-independent) */
img[src*="logos-group-126-1-4"]{ aspect-ratio:318/102; }
img[src*="logos-group-126-1-5"]{ aspect-ratio:409/100; }
img[src*="logos-claude-seeklogo"]{ aspect-ratio:2000/430; }
img[src*="sage.svg"]{ aspect-ratio:59/26; }
img[src*="logo1-armor"]{ aspect-ratio:595/419; }
img[src*="logo2-skutchi"]{ aspect-ratio:160/53; }
img[src*="logo3-rtj"]{ aspect-ratio:1024/262; }
img[src*="logo4-datamartin"]{ aspect-ratio:162/147; }
img[src*="logo5-alltherooms"]{ aspect-ratio:621/96; }
img[src*="footer-group-1618874345"]{ aspect-ratio:1704/444; }
img[src*="footer-gemini-generated-image"]{ aspect-ratio:1024/640; }
img[src*="footer-frame-2."]{ aspect-ratio:91/109; }

/* Visually hidden, still read by screen readers and search engines. Used to give generic link
   labels such as "Read more" a descriptive name without changing how they look (2026-09-25). */
.ix-vh{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
/* Delivery Guarantee line under the service hero buttons (2026-09-25). Inlined here so
   it is styled on first paint and does not shift the hero. */
.ix-guarantee{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin:16px 0 0;padding:7px 14px 7px 11px;border-radius:999px;background:#fff;border:1px solid #d9d0f5;font-family:"AlmadenSans para",Inter,sans-serif;font-size:14px;line-height:1.4;color:#0a0a14;max-width:100%;box-sizing:border-box}
.ix-guarantee svg{flex:0 0 16px;width:16px;height:16px;margin:0;color:var(--purple,#50269E)}
.ix-guarantee b{font-weight:600;color:#0a0a14}
.ix-guarantee a{color:var(--purple,#50269E)!important;font-weight:600;text-decoration:none!important;border-left:1px solid #e4ddf5;padding-left:10px}
.ix-guarantee a:hover{text-decoration:underline!important;text-underline-offset:2px}
@media(max-width:480px){.ix-guarantee{border-radius:12px}}
/* Footer bottom bar: two legal links side by side (2026-09-25). */
.ix-fbar__links{display:flex;flex-wrap:wrap;gap:18px}