/* INCHUB 360 prototype: shared site chrome (header, mega menu, mobile sheet, footer). Tokens only. */

.site-header .bar { flex-wrap: nowrap; gap: var(--ih-space-6); }
.site-header .grow { flex: 1; }
.top-nav { display: flex; align-items: center; gap: 2px; }
.top-nav > li { list-style: none; position: static; }
.top-nav ul, .top-nav { margin: 0; padding: 0; }
.nav-btn, .nav-link {
  font: inherit; font-weight: 700; font-size: var(--ih-font-size-sm); color: var(--ih-text-muted);
  background: transparent; border: 0; cursor: pointer; text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; border-radius: var(--ih-radius-sm); min-block-size: 40px;
}
.nav-btn:hover, .nav-link:hover, .nav-btn[aria-expanded="true"] { color: var(--ih-text); background: var(--ih-surface-alt); }
.nav-btn .chev { inline-size: 10px; block-size: 10px; transition: transform 200ms ease; }
.nav-btn[aria-expanded="true"] .chev { transform: rotate(180deg); }
.head-actions { display: flex; align-items: center; gap: var(--ih-space-2); }
.head-actions .btn { min-block-size: 40px; padding: 8px 14px; }
.lang-select { font: inherit; font-size: var(--ih-font-size-xs); font-weight: 700; color: var(--ih-text); background: transparent; border: 1px solid var(--ih-border); border-radius: var(--ih-radius-pill); padding: 6px 10px; min-block-size: 36px; cursor: pointer; }

/* Mega panel */
.mega {
  position: absolute; inset-inline: 0; inset-block-start: 100%;
  background: var(--ih-surface); border-block: 1px solid var(--ih-border);
  box-shadow: 0 24px 48px -28px rgb(26 20 16 / .35);
  padding-block: var(--ih-space-8);
  opacity: 0; transform: translateY(-6px); pointer-events: none; visibility: hidden;
  transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
}
.mega.is-open { opacity: 1; transform: none; pointer-events: auto; visibility: visible; transition: opacity 180ms ease, transform 180ms ease; }
.mega-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ih-space-4); }
.mega-card {
  display: grid; gap: 6px; align-content: start; padding: var(--ih-space-4); border-radius: var(--ih-radius-lg);
  border: 1px solid var(--ih-border); text-decoration: none; color: var(--ih-text); background: var(--ih-bg);
  transition: border-color 160ms ease, transform 160ms ease;
}
.mega-card:hover { border-color: var(--ih-primary); transform: translateY(-2px); }
.mega-card .flag { font-size: 26px; line-height: 1; }
.mega-card b { font-weight: 800; font-size: var(--ih-font-size-md); }
.mega-card span { font-size: var(--ih-font-size-sm); color: var(--ih-text-muted); }
.mega-card .go { color: var(--ih-text-accent); font-weight: 700; font-size: var(--ih-font-size-sm); margin-block-start: 6px; }
.tag { justify-self: start; font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: var(--ih-radius-pill); background: var(--ih-surface-alt); color: var(--ih-text-muted); }
.tag--core { background: var(--ih-color-orange-100); color: var(--ih-color-orange-800); }
.mega-foot { margin-block-start: var(--ih-space-5); padding-block-start: var(--ih-space-4); border-block-start: 1px solid var(--ih-border); display: flex; gap: var(--ih-space-4); justify-content: space-between; flex-wrap: wrap; font-size: var(--ih-font-size-sm); }
.mega-foot a { font-weight: 700; color: var(--ih-text-accent); text-decoration: none; }
.tasks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ih-space-3); }
.task { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: var(--ih-radius-md); border: 1px solid var(--ih-border); color: var(--ih-text); text-decoration: none; font-weight: 700; font-size: var(--ih-font-size-sm); background: var(--ih-bg); }
.task:hover { border-color: var(--ih-primary); }
.task svg { inline-size: 26px; block-size: 26px; flex: none; color: var(--ih-text); }
.ico { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ico .acc { stroke: var(--ih-primary); }

/* Mobile */
.menu-toggle { display: none; }
@media (max-width: 1020px) {
  .top-nav, .head-actions .hide-sm { display: none; }
  .menu-toggle { display: inline-flex; }
  .mega-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.sheet { position: fixed; inset: 0; z-index: 80; background: var(--ih-bg); overflow-y: auto; padding: var(--ih-space-4); padding-block-start: calc(env(safe-area-inset-top, 0px) + var(--ih-space-4)); display: none; }
.sheet.is-open { display: block; }
.sheet .sheet-head { display: flex; justify-content: space-between; align-items: center; margin-block-end: var(--ih-space-6); }
.sheet h3 { font-size: var(--ih-font-size-xs); letter-spacing: var(--ih-font-tracking-label); text-transform: uppercase; color: var(--ih-text-muted); margin-block: var(--ih-space-6) var(--ih-space-3); }
.sheet .mega-grid, .sheet .tasks { grid-template-columns: 1fr 1fr; }
.sheet .sheet-actions { display: grid; gap: var(--ih-space-2); margin-block-start: var(--ih-space-8); }

/* Footer (light: the brand is paper + orange, ink only for text) */
.site-footer { background: var(--ih-surface-alt); color: var(--ih-text-muted); border-block-start: 1px solid var(--ih-border); padding-block: var(--ih-space-12) var(--ih-space-8); margin-block-start: 0; }
.site-footer a { color: var(--ih-text); text-decoration: none; }
.site-footer a:hover { color: var(--ih-text-accent); }
.foot-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--ih-space-6); }
@media (max-width: 1100px) { .foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) { .foot-grid { grid-template-columns: 1fr 1fr; } }
.foot-grid h4 { margin: 0 0 var(--ih-space-3); color: var(--ih-text); font-size: var(--ih-font-size-sm); font-weight: 800; }
.foot-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: var(--ih-font-size-sm); }
.foot-brand { display: grid; gap: var(--ih-space-4); align-content: start; }
.foot-brand img { block-size: 26px; inline-size: auto; }
:root[data-theme="dark"] .foot-brand img { filter: invert(1) hue-rotate(180deg); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .foot-brand img { filter: invert(1) hue-rotate(180deg); } }
.foot-legal { margin-block-start: var(--ih-space-10); padding-block-start: var(--ih-space-5); border-block-start: 1px solid var(--ih-border); display: flex; justify-content: space-between; gap: var(--ih-space-4); flex-wrap: wrap; font-size: var(--ih-font-size-xs); }

/* Mega panels v2 */
.mega-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mega-card .ico { inline-size: 30px; block-size: 30px; }
.mega-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: var(--ih-space-6); }
.feature-card { display: grid; gap: var(--ih-space-3); align-content: start; padding: var(--ih-space-6); border-radius: 20px; text-decoration: none;
  background: var(--ih-color-orange-50); color: var(--ih-color-brand-ink); border: 1px solid var(--ih-color-orange-200); }
.feature-card b { font-size: var(--ih-font-size-2xl); font-weight: 800; letter-spacing: var(--ih-font-tracking-heading); }
.feature-card span { color: var(--ih-color-neutral-700); }
.feature-card .btn { justify-self: start; margin-block-start: var(--ih-space-2); color: var(--ih-on-primary); }
.feature-card ih-hub { color: var(--ih-color-brand-ink); }
.link-list { display: grid; gap: 6px; align-content: start; }
.list-title { font-size: var(--ih-font-size-xs); font-weight: 800; letter-spacing: var(--ih-font-tracking-label); text-transform: uppercase; color: var(--ih-text-muted); }
:lang(ar) .list-title { letter-spacing: 0; }
.flag-row { display: flex; flex-wrap: wrap; gap: 8px; margin-block-end: var(--ih-space-3); }
.flag-pill { display: inline-flex; gap: 8px; align-items: center; padding: 8px 12px; border-radius: var(--ih-radius-pill); border: 1px solid var(--ih-border); color: var(--ih-text); text-decoration: none; font-weight: 700; font-size: var(--ih-font-size-sm); background: var(--ih-bg); }
.flag-pill:hover { border-color: var(--ih-primary); }
.rich-link { display: grid; gap: 2px; padding: 10px 12px; border-radius: var(--ih-radius-md); text-decoration: none; color: var(--ih-text); }
.rich-link:hover { background: var(--ih-surface-alt); }
.rich-link b { font-weight: 800; font-size: var(--ih-font-size-sm); }
.rich-link span { color: var(--ih-text-muted); font-size: var(--ih-font-size-sm); }
.svc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ih-space-6) var(--ih-space-8); }
.svc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.svc-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.svc-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.svc-group h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--ih-space-3); font-size: var(--ih-font-size-sm); font-weight: 800; color: var(--ih-text); }
.svc-group h4 .ico { inline-size: 24px; block-size: 24px; }
.svc-group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.svc-group li { display: flex; align-items: center; gap: 8px; }
.svc-group a { color: var(--ih-text-muted); text-decoration: none; font-size: var(--ih-font-size-sm); font-weight: 600; padding: 4px 0; }
.svc-group a:hover { color: var(--ih-text-accent); }
@media (max-width: 1020px) { .mega-split, .svc-grid, .svc-grid--3, .svc-grid--4, .mega-grid--3 { grid-template-columns: 1fr; } }

.btn--quiet { border-color: transparent; background: transparent; }
.btn--quiet:hover { background: var(--ih-surface-alt); }
.btn--block { inline-size: 100%; }
.sheet-sec { border-block-end: 1px solid var(--ih-border); padding-block: var(--ih-space-3); }
.sheet-sec > summary { font-weight: 800; font-size: var(--ih-font-size-lg); cursor: pointer; list-style: none; display: flex; justify-content: space-between; }
.sheet-sec > summary::after { content: "+"; color: var(--ih-text-muted); }
.sheet-sec[open] > summary::after { content: "−"; }
.sheet-body { padding-block-start: var(--ih-space-4); }
.sheet > .btn--primary { margin-block-end: var(--ih-space-4); }

/* Scroll reveal (only applied by JS when motion is allowed) */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 600ms cubic-bezier(.2,.7,.2,1), transform 600ms cubic-bezier(.2,.7,.2,1); }
.reveal.is-in { opacity: 1; transform: none; }

.flip { display: inline-block; }
[dir="rtl"] .flip { transform: scaleX(-1); }

/* ===== Start panel v3: rich country cards ===== */
.mega:has(.cc-grid) { padding-block: var(--ih-space-6) var(--ih-space-5); }
.sp-head { display: flex; justify-content: space-between; align-items: end; gap: var(--ih-space-6); margin-block-end: var(--ih-space-5); flex-wrap: wrap; }
.sp-title { font-size: var(--ih-font-size-2xl); font-weight: 800; letter-spacing: var(--ih-font-tracking-heading); }
.sp-sub { color: var(--ih-text-muted); font-size: var(--ih-font-size-sm); max-inline-size: 60ch; }
.sp-note { font-size: 11.5px; color: var(--ih-text-muted); max-inline-size: 38ch; text-align: end; }
:dir(rtl) .sp-note { text-align: start; }
.cc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ih-space-3); }
@media (max-width: 1180px) { .cc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .cc-grid { grid-template-columns: 1fr; } }
/* 6 rows shared across cards (subgrid) so titles, prices and CTAs line up */
.cc {
  position: relative; display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 10px; align-content: start;
  padding: 16px; border-radius: 18px; text-decoration: none; color: var(--ih-text);
  background: var(--ih-surface); border: 1px solid var(--ih-border);
  transition: border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
  -webkit-tap-highlight-color: transparent;
}
@supports not (grid-template-rows: subgrid) { .cc { grid-template-rows: auto auto 1fr auto auto auto; } }
.cc:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 3px; }
.cc:is(:hover, :focus-visible) { border-color: var(--ih-primary); }
@media (hover: hover) { .cc:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -30px rgb(194 56 11 / .55); } }
.cc:active { transform: scale(.99); }
.cc--hot::before { content: ""; position: absolute; inset-inline: 16px; inset-block-start: -1px; block-size: 3px; border-radius: 0 0 3px 3px; background: var(--ih-primary); }
.cc-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cc-flag { inline-size: 44px; block-size: 44px; border-radius: 14px; display: grid; place-items: center; font-size: 25px; background: var(--ih-color-orange-50); border: 1px solid var(--ih-color-orange-100); }
.cc-tag { font-size: 11px; font-weight: 800; padding: 3px 9px; border-radius: var(--ih-radius-pill); background: var(--ih-surface-alt); color: var(--ih-text-muted); white-space: nowrap; }
.cc--hot .cc-tag { background: var(--ih-color-orange-100); color: var(--ih-color-orange-800); }
/* 1. Identity */
.cc-id { display: grid; gap: 3px; }
.cc-name { font-size: var(--ih-font-size-xl); font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
.cc-ent { font-size: var(--ih-font-size-xs); font-weight: 700; color: var(--ih-text-accent); line-height: 1.45; }
/* 2. Benefit + timeline */
.cc-benefit { font-size: var(--ih-font-size-sm); font-weight: 600; line-height: 1.5; color: var(--ih-text); }
.cc-time { display: flex; align-items: center; gap: 6px; font-size: var(--ih-font-size-xs); font-weight: 700; color: var(--ih-text); }
.cc-time .ico { inline-size: 16px; block-size: 16px; flex: none; }
/* 3. Quiet: what we'll ask */
.cc-ask { display: grid; gap: 6px; padding-block-start: 10px; border-block-start: 1px dashed var(--ih-border); }
.cc-ask-l { font-size: 10.5px; font-weight: 700; color: var(--ih-text-muted); }
.cc-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.cc-chips i { font-style: normal; font-size: 10.5px; font-weight: 600; color: var(--ih-text-muted); padding: 2px 8px; border-radius: var(--ih-radius-pill); background: var(--ih-bg); border: 1px solid var(--ih-border); }
/* 4. Price + CTA (emphasized) */
.cc-foot { display: flex; justify-content: space-between; align-items: end; gap: 8px; padding-block-start: 12px; border-block-start: 1px solid var(--ih-border); }
.cc-price { display: grid; line-height: 1.2; font-variant-numeric: tabular-nums; }
.cc-price b { font-size: var(--ih-font-size-2xl); font-weight: 800; letter-spacing: -0.02em; }
.cc-price small { font-size: 10.5px; color: var(--ih-text-muted); font-weight: 600; }
.cc-price em { font-style: normal; font-weight: 800; }
.cc-go { font-size: var(--ih-font-size-xs); font-weight: 800; color: var(--ih-on-primary); background: var(--ih-primary); padding: 10px 14px; border-radius: var(--ih-radius-pill); white-space: nowrap; min-block-size: 40px; display: inline-flex; align-items: center; gap: 6px; transition: background 160ms ease; }
.cc:is(:hover, :focus-visible) .cc-go { background: var(--ih-primary-hover); }
.sp-strip { margin-block-start: var(--ih-space-4); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ih-space-2); }
@media (max-width: 1020px) { .sp-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 340px) { .sp-strip { grid-template-columns: 1fr; } }
.sp-strip a:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 2px; }
.sp-strip a { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: var(--ih-radius-md); background: var(--ih-bg); color: var(--ih-text); text-decoration: none; font-size: var(--ih-font-size-sm); font-weight: 700; border: 1px solid transparent; }
.sp-strip a:hover { border-color: var(--ih-primary); }
.sp-strip a .ico { inline-size: 22px; block-size: 22px; flex: none; }
.sp-strip small { color: var(--ih-text-muted); font-weight: 600; }
.mega-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1020px) { .mega-grid--2 { grid-template-columns: 1fr; } }
.mega-card--hot { background: var(--ih-color-orange-50); border-color: var(--ih-color-orange-200); }
.sheet-link { display: block; padding-block: var(--ih-space-3); border-block-end: 1px solid var(--ih-border); font-weight: 800; font-size: var(--ih-font-size-lg); color: var(--ih-text); text-decoration: none; }
.sheet .cc-grid { grid-template-columns: 1fr; }
.sheet .sp-strip a { padding: 10px; font-size: var(--ih-font-size-xs); }
@media (max-width: 1020px) { .sp-strip small { display: block; } }
.mega { max-block-size: calc(100dvh - 72px); overflow-y: auto; overscroll-behavior: contain; }
.sheet .sp-strip a { background: var(--ih-surface); border-color: var(--ih-border); }

/* ===== Services menu: two panes, same system as Start ===== */
.sv-search { display: flex; align-items: center; gap: 8px; inline-size: min(320px, 100%); padding: 0 12px; border-radius: var(--ih-radius-pill); border: 1px solid var(--ih-border); background: var(--ih-bg); min-block-size: 42px; }
.sv-search:focus-within { border-color: var(--ih-primary); }
.sv-search .ico { inline-size: 18px; block-size: 18px; flex: none; color: var(--ih-text-muted); }
.sv-search input { all: unset; flex: 1; font: inherit; font-size: var(--ih-font-size-sm); color: var(--ih-text); min-inline-size: 0; }
.sv-search input::placeholder { color: var(--ih-text-muted); }
.sv-body { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--ih-space-4); min-block-size: 300px; }
.sv-rail { display: grid; gap: 2px; align-content: start; padding-inline-end: var(--ih-space-3); border-inline-end: 1px solid var(--ih-border); }
.sv-tab { font: inherit; display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 10px; text-align: start; padding: 10px 12px; border-radius: var(--ih-radius-md); border: 0; background: transparent; color: var(--ih-text-muted); font-weight: 700; font-size: var(--ih-font-size-sm); cursor: pointer; position: relative; min-block-size: 42px; }
.sv-tab .ico { inline-size: 20px; block-size: 20px; }
.sv-tab:hover { color: var(--ih-text); background: var(--ih-surface-alt); }
.sv-tab[aria-selected="true"] { color: var(--ih-text); background: var(--ih-color-orange-50); }
.sv-tab[aria-selected="true"]::before { content: ""; position: absolute; inset-inline-start: 0; inset-block: 9px; inline-size: 3px; border-radius: 3px; background: var(--ih-primary); }
.sv-tab:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 1px; }
.sv-count { font-size: 11px; font-weight: 800; color: var(--ih-text-muted); background: var(--ih-surface-alt); border-radius: var(--ih-radius-pill); padding: 1px 7px; }
.sv-free, .sv-tag { font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--ih-color-orange-800); background: var(--ih-color-orange-100); border-radius: var(--ih-radius-pill); padding: 1px 7px; white-space: nowrap; }
.sv-panes { min-inline-size: 0; }
.sv-pane { display: grid; gap: var(--ih-space-3); align-content: start; }
.sv-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px var(--ih-space-3); }
.sv-row { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 10px 12px; border-radius: var(--ih-radius-md); text-decoration: none; color: var(--ih-text); border: 1px solid transparent; min-block-size: 48px; }
.sv-row:is(:hover, :focus-visible) { background: var(--ih-bg); border-color: var(--ih-border); }
.sv-row:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 1px; }
.sv-name { font-weight: 800; font-size: var(--ih-font-size-sm); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sv-flags { font-size: 13px; letter-spacing: 2px; line-height: 1.4; white-space: nowrap; }
.sv-desc { grid-column: 1 / -1; font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); line-height: 1.45; }
.sv-pane-foot { display: flex; gap: var(--ih-space-3); align-items: stretch; flex-wrap: wrap; }
.sv-feat { flex: 1 1 320px; display: grid; gap: 2px; padding: 12px 14px; border-radius: var(--ih-radius-md); background: var(--ih-color-orange-50); border: 1px solid var(--ih-color-orange-200); color: var(--ih-text); text-decoration: none; }
.sv-feat em { font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--ih-color-orange-800); }
.sv-feat b { font-weight: 800; font-size: var(--ih-font-size-sm); }
.sv-feat span { font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); }
.sv-feat:is(:hover, :focus-visible) { border-color: var(--ih-primary); }
.sv-all { align-self: center; font-weight: 800; font-size: var(--ih-font-size-sm); color: var(--ih-text-accent); text-decoration: none; }
.sv-res-h { font-size: var(--ih-font-size-xs); font-weight: 800; color: var(--ih-text-muted); }
.sv-none { font-size: var(--ih-font-size-sm); color: var(--ih-text-muted); }
@media (max-width: 1020px) { .sv-body { grid-template-columns: 1fr; } .sv-rail { border: 0; padding: 0; } }
/* Sheet (mobile) */
.sv-search--sheet { inline-size: 100%; margin-block-end: var(--ih-space-3); }
.sv-acc { display: grid; gap: 6px; }
.sv-cat { border: 1px solid var(--ih-border); border-radius: var(--ih-radius-md); background: var(--ih-surface); }
.sv-cat summary::-webkit-details-marker { display: none; }
.sv-cat summary { list-style: none; display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: center; padding: 12px; font-weight: 800; font-size: var(--ih-font-size-sm); cursor: pointer; min-block-size: 48px; }
.sv-cat summary .ico { inline-size: 20px; block-size: 20px; }
.sv-cat[open] summary { border-block-end: 1px solid var(--ih-border); }
.sheet .sv-rows { grid-template-columns: 1fr; padding: 6px; }
.sv-results--sheet { margin-block-end: var(--ih-space-3); }

/* ===== Services editorial layer (prototype: Make it official) ===== */
.sv-lead { display: flex; align-items: center; justify-content: space-between; gap: var(--ih-space-4); padding: 10px 12px 12px; border-block-end: 1px solid var(--ih-border); flex-wrap: wrap; }
.sv-lead > span { display: grid; gap: 2px; min-inline-size: 0; }
.sv-lead em { font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--ih-text-accent); text-transform: uppercase; letter-spacing: .08em; }
:lang(ar) .sv-lead em { letter-spacing: 0; text-transform: none; }
.sv-lead > span > span { font-size: var(--ih-font-size-md); font-weight: 800; letter-spacing: -0.01em; }
.sv-lead-cta { min-block-size: 40px; padding: 8px 14px; font-size: var(--ih-font-size-xs); }
.sv-row--priority { background: var(--ih-color-orange-50); border-color: var(--ih-color-orange-100); }
.sv-tag--start { color: var(--ih-on-primary); background: var(--ih-primary); }
/* Signature services (Trademark, Offices & addresses, Financial Control): ink field, paper text, orange emblem */
.sv-row--sig { grid-template-columns: 40px 1fr auto; background: var(--ih-color-neutral-950); border-color: var(--ih-color-neutral-950); color: var(--ih-color-neutral-50); }
.sv-row--sig:hover, .sv-row--sig:focus-visible { background: var(--ih-color-neutral-900); border-color: var(--ih-primary); }
.sv-row--sig .sv-sig { grid-row: 1 / span 2; align-self: center; inline-size: 40px; block-size: 40px; }
.sv-row--sig .sv-sig svg { inline-size: 100%; block-size: 100%; display: block; }
.sv-row--sig .sv-desc { grid-column: 2 / -1; color: var(--ih-color-neutral-300); }
.sv-tag--sig { color: var(--ih-color-neutral-950); background: var(--ih-primary); }
.sg-ring { fill: none; stroke: var(--ih-primary); stroke-width: 2.4; }
.sg-txt { fill: var(--ih-primary); font: 800 12px/1 Manrope, sans-serif; letter-spacing: .02em; }
.sg-fill { fill: var(--ih-primary); }
.sg-hole { fill: var(--ih-color-neutral-950); }
.sg-line { fill: none; stroke: var(--ih-primary); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.sg-base { stroke: var(--ih-color-neutral-600); stroke-width: 2; stroke-linecap: round; }
.sv-row--sig .sv-tag:not(.sv-tag--sig) { color: var(--ih-color-neutral-950); background: var(--ih-color-orange-200); }

.ed-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); gap: var(--ih-space-2); inline-size: 100%; }
.ed { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: start; padding: 12px; border-radius: 14px; border: 1px solid var(--ih-border); background: var(--ih-surface); color: var(--ih-text); text-decoration: none; transition: border-color 160ms ease, box-shadow 160ms ease; }
a.ed:is(:hover, :focus-visible) { border-color: var(--ih-primary); box-shadow: 0 14px 30px -24px rgb(194 56 11 / .5); }
a.ed:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 2px; }
.ed-art svg { inline-size: 64px; block-size: auto; display: block; }
.ed-body { display: grid; gap: 3px; min-inline-size: 0; }
.ed-type { font-size: 10.5px; font-weight: 800; color: var(--ih-text-muted); }
.ed-title { font-size: var(--ih-font-size-sm); font-weight: 800; line-height: 1.3; }
.ed-desc { font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); line-height: 1.45; }
.ed-cta { margin-block-start: 4px; font-size: var(--ih-font-size-xs); font-weight: 800; color: var(--ih-text-accent); }
/* The first card of every category is the featured one: cream field, larger artwork on the end side */
.ed-grid > .ed:first-child { grid-template-columns: minmax(0, 1fr) 96px; background: var(--ih-color-orange-50); border-color: var(--ih-color-orange-200); }
.ed-grid > .ed:first-child .ed-art { order: 2; align-self: center; }
.ed-grid > .ed:first-child .ed-art svg { inline-size: 96px; }
.ed-grid > .ed:first-child .ed-title { font-size: var(--ih-font-size-md); }
/* Checklist: paper document feel */
.ed--check { background: var(--ih-bg); }
/* Tool: outlined, action-forward */
.ed--tool { border-color: var(--ih-color-orange-200); }
.ed--tool .ed-cta { color: var(--ih-on-primary); background: var(--ih-primary); justify-self: start; padding: 5px 10px; border-radius: var(--ih-radius-pill); }
/* Planned content: visible, honest, not clickable */
.ed.is-planned .ed-cta { color: var(--ih-text-muted); background: transparent; padding: 0; }
.ed-soon { color: var(--ih-text-accent); }
/* Artwork palette (brand tokens only) */
.a-ink { fill: var(--ih-text); }
.a-acc { fill: var(--ih-primary); }
.a-ink-soft { fill: var(--ih-color-neutral-300); }
.a-line { fill: none; stroke: var(--ih-text); stroke-width: 1.4; }
.a-rule { fill: none; stroke: var(--ih-color-neutral-300); stroke-width: 1.4; stroke-linecap: round; }
.a-doc { fill: var(--ih-surface); stroke: var(--ih-color-neutral-300); stroke-width: 1.4; }
.a-dash { stroke-dasharray: 4 5; }
.a-acc-s { fill: none; stroke: var(--ih-primary); stroke-linecap: round; }
.a-ink-soft-s { fill: none; stroke: var(--ih-color-neutral-300); stroke-linecap: round; }
.a-surface { fill: var(--ih-surface); }
@media (max-width: 1180px) { .ed-grid { grid-template-columns: 1fr 1fr; } .ed-grid > .ed:first-child { grid-column: 1 / -1; } }
/* Two cards: featured + one, sharing the full width (no empty column) */
.ed-grid--2 { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
@media (max-width: 1180px) { .ed-grid--2 > .ed:first-child { grid-column: auto; } }
/* Strip in the Services panel: items share the row even when one is hidden */
@media (min-width: 1021px) { .mega .sp-strip { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); } }
/* Mobile/tablet sheet: calm one-line links instead of cards (no art, no buttons) */
.ed-grid--sheet { grid-template-columns: 1fr; gap: 0; margin: 4px 6px 8px; padding: 0; border-block-start: 1px solid var(--ih-border); }
.ed-grid--sheet .ed, .ed-grid--sheet > .ed:first-child { display: flex; flex-direction: column; gap: 2px; padding: 10px 8px; min-block-size: 48px; justify-content: center;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; grid-column: auto; }
.ed-grid--sheet .ed + .ed { border-block-start: 1px solid var(--ih-border); }
.ed-grid--sheet .ed-art, .ed-grid--sheet .ed-desc, .ed-grid--sheet .ed-cta { display: none; }
.ed-grid--sheet .ed-body { display: contents; }
.ed-grid--sheet .ed-type { order: 2; font-size: var(--ih-font-size-xs); }
.ed-grid--sheet .ed-title { order: 1; font-size: var(--ih-font-size-sm); font-weight: 500; color: var(--ih-text-muted); }
.sv-rows > .sv-row:only-child { grid-column: 1 / -1; }

/* Service mode: dark header and footer around a light page (service pages + checkout). The home page stays fully light.
   Only the bar is dark; mega panels and the mobile sheet stay light. Logo: INCHUB in paper, 360 in orange (approved reversed colours). */
.chrome-dark .site-header, .chrome-dark .app-head { background: var(--ih-color-neutral-950); border-block-end-color: var(--ih-color-neutral-900); backdrop-filter: none; }
.chrome-dark :is(.site-header, .app-head) .bar { color: var(--ih-color-neutral-50); }
.chrome-dark :is(.site-header, .app-head) .bar :is(ih-hub, .wm) { color: var(--ih-color-neutral-50); }
.chrome-dark .site-header .bar :is(.nav-btn, .nav-link) { color: var(--ih-color-neutral-300); }
.chrome-dark .site-header .bar :is(.nav-btn, .nav-link):hover, .chrome-dark .site-header .bar .nav-btn[aria-expanded="true"] { color: var(--ih-color-neutral-50); background: var(--ih-color-neutral-800); }
.chrome-dark :is(.site-header, .app-head) .bar :is(.lang-select, .lang-mini) { color: var(--ih-color-neutral-50); background: transparent; border-color: var(--ih-color-neutral-700); }
.chrome-dark :is(.lang-select, .lang-mini) option { color: var(--ih-text); background: var(--ih-surface); }
.chrome-dark .site-header .bar :is(.btn--quiet, .menu-toggle) { color: var(--ih-color-neutral-50); background: transparent; border-color: var(--ih-color-neutral-700); }
.chrome-dark .site-header .bar .btn--quiet { border-color: transparent; }
.chrome-dark .site-header .bar .btn--quiet:hover { background: var(--ih-color-neutral-800); }
.chrome-dark .app-head .secure { color: var(--ih-color-neutral-300); }
.chrome-dark .site-footer, .chrome-dark .co-foot { background: var(--ih-color-neutral-950); color: var(--ih-color-neutral-400); border-block-start-color: var(--ih-color-neutral-900); }
.chrome-dark .site-footer a, .chrome-dark .co-foot a { color: var(--ih-color-neutral-100); }
.chrome-dark .site-footer a:hover, .chrome-dark .co-foot a:hover { color: var(--ih-primary); }
.chrome-dark .foot-grid h4 { color: var(--ih-color-neutral-50); }
.chrome-dark .foot-legal { border-block-start-color: var(--ih-color-neutral-800); }
.chrome-dark .foot-brand img { content: url("../assets/logo/lockup-reversed.svg"); }

/* Footer always sits at the bottom of the window, with no empty strip below it on short pages */
body { min-block-size: 100dvh; display: flex; flex-direction: column; }
body > main, body > .portal-shell { flex: 1 0 auto; }

/* WhatsApp support + Trustpilot badge (brand tokens; no third-party colours) */
.wa { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--ih-text); font-weight: 700; font-size: var(--ih-font-size-xs); min-block-size: 40px; padding: 6px 10px; border-radius: var(--ih-radius-pill); white-space: nowrap; }
.wa .ico { inline-size: 18px; block-size: 18px; color: var(--ih-color-status-success); }
.wa:hover { background: var(--ih-surface-alt); }
.chrome-dark .site-header .bar .wa { color: var(--ih-color-neutral-50); }
.chrome-dark .site-header .bar .wa:hover { background: var(--ih-color-neutral-800); }
@media (max-width: 1280px) { .wa--head span { display: none; } }
@media (max-width: 980px) { .wa--head { display: none; } }
.wa-card { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--ih-border); border-radius: var(--ih-radius-md); background: var(--ih-surface); color: var(--ih-text); text-decoration: none; font-size: var(--ih-font-size-sm); margin-block: 8px; }
.wa-card .ico { inline-size: 26px; block-size: 26px; flex: none; color: var(--ih-color-status-success); }
.wa-card b { display: block; } .wa-card small { color: var(--ih-text-muted); font-size: var(--ih-font-size-xs); }
.wa-card:hover { border-color: var(--ih-text); }
.chrome-dark .site-footer .wa-card { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-800); color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .wa-card small { color: var(--ih-color-neutral-400); }
.tp-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--ih-radius-md); border: 1px solid var(--ih-border); background: var(--ih-surface); color: var(--ih-text); text-decoration: none; font-size: var(--ih-font-size-sm); }
.tp-badge small { color: var(--ih-text-muted); font-size: var(--ih-font-size-xs); }
.tp-star { inline-size: 22px; block-size: 22px; display: grid; place-items: center; border-radius: 4px; background: var(--ih-color-status-success); color: var(--ih-color-neutral-50); font-size: 13px; }
.tp-badge:hover { border-color: var(--ih-text); }
.chrome-dark .site-footer .tp-badge { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-800); color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .tp-badge small { color: var(--ih-color-neutral-400); }
.hero-trust { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-block-start: var(--ih-space-4); }
.hero-trust .wa { border: 1px solid var(--ih-border); background: var(--ih-surface); }
/* Header stays on one line in every language (RU/ES strings are longer) */
.top-nav :is(.nav-btn, .nav-link), .head-actions .btn { white-space: nowrap; }
@media (max-width: 1560px) { .wa--head span { display: none; } }
@media (max-width: 1240px) { .site-header .bar { gap: var(--ih-space-3); } .nav-btn, .nav-link { padding-inline: 8px; } }
/* Footer social icons (real brand colours, see SOCIAL_ICONS in site.js) */
.social { display: grid; gap: 8px; margin-block: 6px; }
.social-t { font-size: var(--ih-font-size-sm); color: var(--ih-text); }
.chrome-dark .site-footer .social-t { color: var(--ih-color-neutral-50); }
.social-icons { display: flex; flex-wrap: wrap; gap: 7px; }
.social-i { display: grid; place-items: center; inline-size: 28px; block-size: 28px; border-radius: 9px; transition: transform 160ms ease; }
.social-i svg { inline-size: 28px; block-size: 28px; display: block; }
.social-i:hover { transform: translateY(-2px); }
.social-i:focus-visible { outline: 2px solid var(--ih-focus-ring); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .social-i { transition: none; } }
.si-mail-bg { fill: var(--ih-primary); } .si-mail-fg { stroke: var(--ih-color-neutral-950); }
.social-mail { font-size: var(--ih-font-size-xs); font-weight: 700; justify-self: start; }

/* Social icons: always one small row */
.social-icons { flex-wrap: nowrap; gap: 6px; }
.social-i, .social-i svg { inline-size: 26px !important; block-size: 26px !important; }

/* Trustpilot: stands out (their green is a third-party mark, like the social icons) */
.tp-card { display: grid; gap: 6px; padding: 14px 16px; border-radius: var(--ih-radius-md); background: var(--ih-surface); border: 1px solid var(--ih-border); color: var(--ih-text); text-decoration: none; max-inline-size: 300px; }
.tp-card:hover { border-color: #00B67A; }
.tp-brand { display: flex; align-items: center; gap: 6px; font-size: var(--ih-font-size-md); }
.tp-brand svg { inline-size: 22px; block-size: 22px; }
.tp-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tp-word { font-size: var(--ih-font-size-lg); }
.tp-meta { font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); }
.tp-go { font-size: var(--ih-font-size-xs); font-weight: 800; color: var(--ih-text-accent); }
.tp-stars { display: inline-flex; gap: 2px; }
.tp-stars i { inline-size: 22px; block-size: 22px; display: grid; place-items: center; background: linear-gradient(90deg, #00B67A var(--f), var(--ih-color-neutral-300) var(--f)); }
.tp-stars svg { inline-size: 16px; block-size: 16px; }
.tp-badge .tp-stars i { inline-size: 16px; block-size: 16px; } .tp-badge .tp-stars svg { inline-size: 12px; block-size: 12px; }
.tp-badge > svg { inline-size: 18px; block-size: 18px; flex: none; }
.chrome-dark .site-footer .tp-card { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-800); color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .tp-meta { color: var(--ih-color-neutral-400); }
.chrome-dark .site-footer .tp-go { color: var(--ih-primary); }

/* App download: official-size badge slots (Apple 120×40, Google 135×40 at 1×) + QR slot */
.app-dl { display: flex; flex-wrap: wrap; gap: 14px 18px; align-items: center; }
.store-badges { display: flex; flex-wrap: wrap; gap: 10px; }
.store-badge { display: inline-flex; flex-direction: column; justify-content: center; block-size: 48px; min-inline-size: 150px; padding: 4px 16px; border-radius: 10px; background: var(--ih-color-neutral-950); color: var(--ih-color-neutral-50); text-decoration: none; line-height: 1.1; }
.store-badge small { font-size: 10px; opacity: .75; } .store-badge b { font-size: 17px; letter-spacing: -.01em; }
.store-badge img { block-size: 48px; inline-size: auto; display: block; }
.store-badge--slot { opacity: .85; }
.app-qr { display: flex; align-items: center; gap: 10px; max-inline-size: 260px; }
.qr-slot { inline-size: 84px; block-size: 84px; flex: none; display: grid; place-items: center; border: 1.5px dashed var(--ih-color-neutral-300); border-radius: 12px; background: var(--ih-surface); color: var(--ih-color-neutral-400); }
.qr-slot svg { inline-size: 40px; block-size: 40px; }
.app-qr small { font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); line-height: 1.5; }
@media (max-width: 760px) { .app-qr { display: none; } } /* on a phone the badges are the link; a QR is for desktop */

/* Footer layout: brand + Trustpilot · columns · app download with social icons under it · legal */
.foot-head { display: flex; flex-wrap: wrap; gap: var(--ih-space-6); align-items: flex-start; justify-content: space-between; padding-block-end: var(--ih-space-8); margin-block-end: var(--ih-space-8); border-block-end: 1px solid var(--ih-border); }
.foot-head .foot-brand { max-inline-size: 420px; }
.foot-trust .tp-card { min-inline-size: 260px; }
.foot-app { display: grid; grid-template-columns: 1fr minmax(0, 380px); gap: var(--ih-space-8); align-items: start; margin-block-start: var(--ih-space-10); padding-block-start: var(--ih-space-8); border-block-start: 1px solid var(--ih-border); }
@media (max-width: 860px) { .foot-app { grid-template-columns: 1fr; } }
.foot-app-l { display: grid; gap: var(--ih-space-4); justify-items: start; }
/* Newsletter: one small card on the end side of the footer */
.nl { display: grid; gap: 8px; padding: 16px; border-radius: 16px; background: var(--ih-surface); border: 1px solid var(--ih-border); }
.nl-t { font-size: var(--ih-font-size-sm); font-weight: 800; color: var(--ih-text); }
.nl-p { font-size: 12.5px; color: var(--ih-text-muted); }
.nl-row { display: grid; grid-template-columns: 1fr auto; gap: 6px; padding: 4px; border-radius: 12px; border: 1px solid var(--ih-border); background: var(--ih-bg); }
.nl-row:focus-within { border-color: var(--ih-color-brand-orange); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ih-color-brand-orange) 18%, transparent); }
.nl-row input { min-inline-size: 0; border: 0; background: transparent; font: inherit; font-size: var(--ih-font-size-sm); font-weight: 600; color: var(--ih-text); padding-inline: 8px; outline: none; }
.nl-row input[aria-invalid="true"] { color: var(--ih-danger); }
.nl-row .btn { min-block-size: 38px; padding-inline: 14px; }
.nl-err { color: var(--ih-danger); font-size: 12px; font-weight: 700; }
.nl-legal { font-size: 11px; color: var(--ih-text-muted); }
.nl-legal a { color: var(--ih-text); }
.nl-ok { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center; font-size: var(--ih-font-size-sm); font-weight: 700; color: var(--ih-success); }
.nl-ok ih-hub { --ih-hub-size: 26px; }
.chrome-dark .site-footer .nl { background: color-mix(in srgb, var(--ih-color-neutral-800) 70%, transparent); border-color: var(--ih-color-neutral-800); }
.chrome-dark .site-footer .nl-t { color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .nl-p, .chrome-dark .site-footer .nl-legal { color: var(--ih-color-neutral-400); }
.chrome-dark .site-footer .nl-legal a { color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .nl-row { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-700); }
.chrome-dark .site-footer .nl-row input { color: var(--ih-color-neutral-50); }
.foot-app-dl { display: grid; gap: 10px; }
.foot-app-t { font-size: var(--ih-font-size-sm); color: var(--ih-text); }
.chrome-dark .site-footer .foot-head, .chrome-dark .site-footer .foot-app { border-color: var(--ih-color-neutral-800); }
.chrome-dark .site-footer .foot-app-t { color: var(--ih-color-neutral-50); }
.chrome-dark .site-footer .qr-slot { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-700); color: var(--ih-color-neutral-500); }
.chrome-dark .site-footer .app-qr small { color: var(--ih-color-neutral-400); }
.chrome-dark .site-footer .store-badge { box-shadow: inset 0 0 0 1px var(--ih-color-neutral-700); }
@media (max-width: 1100px) { .foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .foot-head { flex-direction: column; } .foot-trust, .foot-trust .tp-card { inline-size: 100%; max-inline-size: none; } }
/* Official store badges: Apple SVG 40px tall; Google PNG includes its own clear space, so it is drawn taller to match */
.store-badge--img { background: none !important; padding: 0; min-inline-size: 0; block-size: auto; box-shadow: none !important; }
.store-badge--img .badge-ios { block-size: 44px; inline-size: auto; display: block; }
.store-badge--img .badge-gp { block-size: 65px; inline-size: auto; display: block; margin-block: -10.5px; margin-inline: -8px; }
.store-badges { align-items: center; }
.store-badge.is-soon { opacity: .9; cursor: default; }
.store-soon { flex-basis: 100%; font-size: var(--ih-font-size-xs); color: var(--ih-text-muted); }
.chrome-dark .site-footer .store-soon { color: var(--ih-color-neutral-400); }
.foot-tm { margin-block-start: var(--ih-space-3); font-size: 11px; color: var(--ih-text-muted); } .chrome-dark .site-footer .foot-tm { color: var(--ih-color-neutral-500); }
.app-dl .store-badges { max-inline-size: 330px; }
/* Footer Trustpilot: a single strip under the logo */
.tp-strip { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-block-start: var(--ih-space-3); padding: 8px 12px; border-radius: var(--ih-radius-md); border: 1px solid var(--ih-border); color: var(--ih-text); text-decoration: none; font-size: var(--ih-font-size-sm); }
.tp-strip > svg { inline-size: 18px; block-size: 18px; }
.tp-strip .tp-word { font-weight: 800; }
.tp-strip .tp-stars i { inline-size: 18px; block-size: 18px; } .tp-strip .tp-stars svg { inline-size: 13px; block-size: 13px; }
.tp-strip .tp-meta { font-size: var(--ih-font-size-xs); }
.tp-strip:hover { border-color: #00B67A; }
.chrome-dark .site-footer .tp-strip { color: var(--ih-color-neutral-50); border-color: var(--ih-color-neutral-800); }
.chrome-dark .site-footer .tp-strip .tp-meta { color: var(--ih-color-neutral-300); }

/* Footer bottom: copyright + accepted payment methods */
.foot-legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.has-chat .foot-legal { padding-inline-end: 84px; }
@media (max-width: 760px) { .has-chat .foot-legal { padding-inline-end: 0; padding-block-end: 72px; } }
.pay-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.pay-safe { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; color: var(--ih-success); }
.pay-safe svg, .pay-bank svg { inline-size: 16px; block-size: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pay-marks { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pay-marks > svg { inline-size: 38px; block-size: 24px; display: block; }
.pay-bank { display: inline-flex; align-items: center; gap: 5px; block-size: 24px; padding-inline: 8px; border-radius: 4px; background: var(--ih-surface); border: 1px solid var(--ih-border); font-size: 11px; font-weight: 800; color: var(--ih-text); }
.chrome-dark .site-footer .pay-safe { color: var(--ih-color-status-success-bg); }
.chrome-dark .site-footer .pay-bank { background: var(--ih-color-neutral-900); border-color: var(--ih-color-neutral-700); color: var(--ih-color-neutral-50); }

/* Living Hub on orange surfaces: the accent leaf and hub dot turn paper so the mark stays complete (approved app-icon colours). */
:is(.btn--primary, .transfer .box.us, .trk-run, .fx6 .fbtn, .ihc-fab, .ihc-av, .chat-av, .ihc-m.me, .ihc-send, .float-tag, .tk) ih-hub { --ih-hub-accent: var(--ih-color-brand-paper); }

/* Footer logo: the live mark (turning) + wordmark, same as the header */
.foot-logo { justify-self: start; color: var(--ih-text); text-decoration: none; }
.foot-logo ih-hub { --ih-hub-size: 30px; }
.chrome-dark .site-footer .foot-logo { color: var(--ih-color-neutral-50); }

/* Official partner logos (js/brands.js). The file is shown as published: no filters, no recolouring. */
.blogo { display: inline-flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box;
  background: var(--ih-color-neutral-50); border: 1px solid var(--ih-color-neutral-200); border-radius: var(--ih-radius-sm); }
.blogo { overflow: hidden; } .blogo img { display: block; width: auto; height: auto; min-width: 0; max-width: 100%; object-fit: contain; }
.blogo--sm { height: 32px; min-width: 64px; max-width: 104px; padding: 5px 8px; } .blogo--sm img { max-height: 20px; max-width: 86px; }
.blogo--md { height: 44px; min-width: 88px; max-width: 140px; padding: 7px 12px; } .blogo--md img { max-height: 28px; max-width: 114px; }
.blogo--lg { height: 64px; min-width: 128px; max-width: 200px; padding: 10px 18px; } .blogo--lg img { max-height: 40px; max-width: 164px; }
.blogo--dark { background: var(--ih-color-brand-ink); border-color: var(--ih-color-brand-ink); }
.blogo--text { font-weight: 800; font-size: 13px; color: var(--ih-color-neutral-800); text-align: center; line-height: 1.15; }
.blogo-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

/* ---------- Site-wide motion layer (js/motion.js) ---------- */
.mv { opacity: 0; transform: translateY(18px); }
.mv-in { opacity: 1; transform: none; transition: opacity 600ms cubic-bezier(.2, .7, .2, 1) var(--mv-d, 0ms), transform 600ms cubic-bezier(.2, .7, .2, 1) var(--mv-d, 0ms); }
.spot { background-image: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), color-mix(in srgb, var(--ih-color-brand-orange) 9%, transparent), transparent 70%); }
.x-hero .bg-fan, .cx-hero-fan { transform: translateY(calc(var(--sy, 0) * .08px)); }
.x-hero h1.cx-words .l2 .w { color: inherit; }

/* Hero art for utility pages: rings, an orbiting Hub and a floating card with the page's icon. */
.x-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 380px); gap: clamp(20px, 4vw, 56px); align-items: center; }
.x-art { position: relative; aspect-ratio: 6 / 5; }
.xa-rings { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; overflow: visible; }
.xa-rings circle { fill: none; stroke: color-mix(in srgb, var(--ih-color-brand-paper) 22%, transparent); stroke-width: 1.2; transform-origin: 180px 150px; }
.xa-r1 { stroke-dasharray: 2 9; animation: xa-spin 60s linear infinite; }
.xa-r2 { stroke-dasharray: 14 10; animation: xa-spin 40s linear infinite reverse; }
.xa-r3 { stroke: color-mix(in srgb, var(--ih-color-brand-orange) 45%, transparent) !important; stroke-dasharray: 1 6; animation: xa-spin 24s linear infinite; }
.xa-orbit { position: absolute; inset: 7% 14.5%; border-radius: 50%; animation: xa-spin 22s linear infinite; }
.xa-orbit2 { inset: 22% 24.5%; animation-duration: 14s; animation-direction: reverse; }
.xa-sat { position: absolute; inset-block-start: -18px; inset-inline-start: calc(50% - 18px); inline-size: 36px; block-size: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--ih-color-brand-ink); border: 1px solid color-mix(in srgb, var(--ih-color-brand-paper) 25%, transparent); animation: xa-spin 22s linear infinite reverse; }
.xa-sat ih-hub { --ih-hub-size: 24px; }
.xa-dot { position: absolute; inset-block-end: -6px; inset-inline-start: calc(50% - 6px); inline-size: 12px; block-size: 12px; border-radius: 50%; background: var(--ih-color-brand-orange); box-shadow: 0 0 18px var(--ih-color-brand-orange); }
.xa-card { position: absolute; inset-block-start: 50%; inset-inline-start: 50%; inline-size: 34%; aspect-ratio: 1; translate: -50% -50%; display: grid; place-items: center; border-radius: 24px;
  background: color-mix(in srgb, var(--ih-color-brand-paper) 10%, transparent); border: 1px solid color-mix(in srgb, var(--ih-color-brand-paper) 24%, transparent); backdrop-filter: blur(6px); animation: xa-bob 6s ease-in-out infinite; }
[dir="rtl"] .xa-card { translate: 50% -50%; }
.xa-card svg { inline-size: 58%; block-size: 58%; overflow: visible; }
.xa-card .l { fill: none; stroke: var(--ih-color-brand-paper); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.xa-card .w { stroke: var(--ih-color-brand-orange); stroke-dasharray: 40; stroke-dashoffset: 40; animation: xa-draw 3.2s ease-in-out infinite; }
.xa-card .f { fill: var(--ih-color-brand-orange); }
.xa-card .t { font: 800 30px/1 Manrope, sans-serif; fill: var(--ih-color-brand-paper); } .xa-card .t.s { font-size: 17px; fill: var(--ih-color-brand-orange); }
.xa-chip { position: absolute; inline-size: 34px; block-size: 34px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; color: var(--ih-color-brand-ink); background: var(--ih-color-brand-orange); box-shadow: 0 10px 24px -10px var(--ih-color-brand-orange); animation: xa-float 7s ease-in-out infinite; }
.xa-chip.c1 { inset-block-start: 10%; inset-inline-end: 12%; }
.xa-chip.c2 { inset-block-end: 14%; inset-inline-start: 10%; inline-size: 14px; block-size: 14px; border-radius: 50%; animation-delay: -2s; }
.xa-chip.c3 { inset-block-end: 8%; inset-inline-end: 22%; background: var(--ih-color-brand-paper); animation-delay: -4s; }
@keyframes xa-spin { to { rotate: 360deg; } }
@keyframes xa-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes xa-float { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(6px, -12px) rotate(6deg); } }
@keyframes xa-draw { 0%, 20% { stroke-dashoffset: 40; } 50%, 80% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -40; } }
@media (max-width: 860px) { .x-wrap { grid-template-columns: 1fr; } .x-art { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .mv { opacity: 1; transform: none; } .x-hero .bg-fan, .cx-hero-fan { transform: none; }
  .x-art *, .xa-orbit { animation: none !important; } .xa-card .w { stroke-dashoffset: 0; }
}

/* Service pages and checkout opened inside the customer portal (js/site.js IN_APP) */
.in-app .app-head, .in-app .proto-flag, .in-app .ihc { display: none !important; }
.in-app body { background: var(--ih-bg); }
