/* ==========================================================================
   Urja Investment — multipage layer
   Loaded after urja.css. Same tokens; adds the service-led components.
   ========================================================================== */

/* ---------- Twin Blade icons ----------
   a = Urja gold · b = second metal (navy on light, ivory on dark) · c = glint on gold
   e / es = engraving on the second metal · d = dimmed · r = softened corners            */
.uico { flex: none; overflow: visible; --ia: url(#uA); --ib: url(#uB); --ih: url(#uH); --ic: #FFF4D2; --ie: #F3E9CF; --ik: #10222E; }
.uico .a { fill: var(--ia); }
.uico .b { fill: var(--ib); }
.uico .h { fill: var(--ih); }
.uico .h.r { stroke: var(--ih); stroke-width: 2; stroke-linejoin: round; }
.uico .k { fill: var(--ik); }
.uico .c { fill: var(--ic); opacity: .9; }
.uico .e { fill: var(--ie); opacity: .8; }
.uico .as, .uico .bs, .uico .cs, .uico .es, .uico .ks { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.uico .as { stroke: var(--ia); }
.uico .bs { stroke: var(--ib); }
.uico .cs { stroke: var(--ic); }
.uico .ks { stroke: var(--ik); }
.uico .es { stroke: var(--ie); opacity: .62; }
.uico .a.r { stroke: var(--ia); stroke-width: 2; stroke-linejoin: round; }
.uico .b.r { stroke: var(--ib); stroke-width: 2; stroke-linejoin: round; }
.uico .c.r { stroke: var(--ic); stroke-width: 2; stroke-linejoin: round; }
.uico .d { opacity: .55; }

/* dark surfaces: brighter gold, ivory second metal, navy engraving */
:root[data-theme="dark"] .uico,
.on-dark .uico, .platform .uico, .finalcta .uico, .footer .uico, .vmv__card--dark .uico,
.smhome .uico, .ways .uico, .itile--dark .uico, .svc:hover .svc__ico .uico {
  --ia: url(#uAd); --ib: url(#uBd); --ih: url(#uHd); --ic: #FFFFFF; --ie: #0D1A22;
}
.uico--mono { --ia: currentColor !important; --ib: currentColor !important; --ih: currentColor !important; --ik: transparent !important; --ic: transparent !important; --ie: transparent !important; }
.uico--mono .b { opacity: .55; }

/* ---------- icon tiles ---------- */
.itile, .mega__ico, .picker__ico, .svc__ico, .step__ico, .ways__ico, .value__ico, .feat__ico,
.rel__ico, .tool__ico, .office__ico, .vmv__ico, .abt__pico, .appx__fico {
  position: relative; isolation: isolate; overflow: hidden;
  background: linear-gradient(150deg, #FFFEFB 0%, #F8EFD9 58%, #F1E2BF 100%) !important;
  border: 1px solid rgba(176, 122, 35, .24);
  box-shadow: inset 0 1px 0 #fff, inset 0 -10px 16px -12px rgba(138, 91, 23, .35), 0 12px 22px -14px rgba(138, 91, 23, .55);
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
/* the mark's two blades, embossed into every tile */
.itile::before, .mega__ico::before, .picker__ico::before, .svc__ico::before, .step__ico::before,
.ways__ico::before, .value__ico::before, .feat__ico::before, .rel__ico::before, .tool__ico::before,
.office__ico::before, .vmv__ico::before, .abt__pico::before, .appx__fico::before {
  content: ''; position: absolute; z-index: -1; right: -22%; bottom: -30%; width: 92%; height: 92%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23B07A23' d='M38 5C20 25 28 45 50 60c16 11 20 22 12 37 22-17 22-39 0-55C44 29 34 20 38 5ZM18 45C8 58 14 70 28 79c10 7 12 13 9 21 13-12 11-24-1-33-12-9-19-14-18-22Z'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .1; pointer-events: none;
}
.itile > .uico, [class$="__ico"] > .uico { width: 62%; height: 62%; }

:root[data-theme="dark"] .itile, :root[data-theme="dark"] [class$="__ico"],
.itile--dark, .ways__ico, .vmv__card--dark .vmv__ico, .smhome [class$="__ico"], .on-dark [class$="__ico"], .platform [class$="__ico"], .finalcta [class$="__ico"],
.svc:hover .svc__ico {
  background: linear-gradient(150deg, #20384A 0%, #10222E 55%, #08121A 100%) !important;
  border-color: rgba(245, 194, 94, .34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), inset 0 0 22px -6px rgba(245, 194, 94, .22), 0 14px 26px -14px rgba(0, 0, 0, .75);
}
.svc:hover .svc__ico { transform: translateY(-2px) rotate(-2deg); }

/* ---------- utility ---------- */
.h-sm { font-size: 1.3rem; margin-bottom: 18px; }
.sec--tight { padding: clamp(40px, 5vw, 64px) 0; }
.sec--alt { background: var(--bg); border-block: 1px solid var(--line); }
.btnrow { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.edhead--two { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: end; }
.snaphead { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 30px; }
.snaphead h2 { margin-top: 10px; }
.tablewrap { overflow-x: auto; border-radius: var(--r-card); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-soft); }

/* ---------- top utility bar ---------- */
.topbar { background: #0B0B0C; color: rgba(247, 241, 226, .78); font-size: .76rem; }
.topbar__inner { max-width: var(--wrap); margin: 0 auto; padding: 7px var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.topbar__reg { color: var(--gold); letter-spacing: .04em; font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar__links { display: flex; gap: 20px; flex: none; }
.topbar__links a:hover { color: var(--gold); }

/* ---------- header additions ---------- */
.nav.is-stuck { box-shadow: 0 10px 30px -18px rgba(16, 34, 46, .35); }
.nav__menu a.is-current, .nav__menu button.is-current { color: var(--gold-deep); }
.has-sub--mega { position: static; }
.nav__inner { position: relative; }
.mega {
  position: absolute; left: var(--gutter); right: var(--gutter); top: calc(100% - 6px);
  display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(260px, 1fr); gap: 8px;
  padding: 12px; border-radius: 26px; background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-card);
}
.mega[hidden] { display: none; }
.mega__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; align-content: start; }
.mega__grid a { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 16px; }
.mega__grid a::after { display: none; }
.mega__grid a:hover { background: var(--bg); }
.mega__ico { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; background: color-mix(in srgb, var(--gold) 16%, var(--surface)); flex: none; }
.mega__grid strong { display: block; font-size: .95rem; font-weight: 600; }
.mega__grid small { display: block; font-size: .8rem; color: var(--text-soft); font-weight: 400; }
.mega__aside { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 24px; border-radius: 18px; background: radial-gradient(120% 120% at 100% 100%, #2A1D08 0%, #0B0B0C 62%); color: var(--text-on-dark); }
.mega__kicker { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.mega__title { font-family: var(--font-display); font-size: 1.45rem; font-weight: 700; line-height: 1.12; color: #fff; }
.mega__copy { font-size: .86rem; color: rgba(247, 241, 226, .76); margin-bottom: 6px; }
.mega__aside .link-gold { color: var(--gold); padding: 0 !important; }
.mega__aside .btn, .mega__aside a { padding: 13px 22px; }
.mega__aside a::after { display: none; }

.mobile-menu { max-height: calc(100dvh - 72px); overflow-y: auto; }
.mobile-menu__label { font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-deep); margin: 10px 0 4px; }
.mobile-menu__services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 6px; }
.mobile-menu__services a { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--bg); font-weight: 600; font-size: .88rem; }
html.menu-open { overflow: hidden; }

/* ---------- hero: service picker ---------- */
.hero--services { min-height: clamp(600px, 78vh, 820px); }
.hero__glow { position: absolute; inset: -10% -10% 0 40%; background: radial-gradient(55% 60% at 62% 38%, rgba(245, 194, 94, .42), transparent 70%), radial-gradient(40% 50% at 90% 90%, rgba(176, 122, 35, .22), transparent 70%); }
.hero--services .hero__visual { padding-top: 0; }
.hero__ticks { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 28px; }
.hero__ticks li { display: inline-flex; align-items: center; gap: 8px; font-size: .88rem; font-weight: 500; color: var(--text-soft); }

.picker {
  width: min(640px, 100%); padding: 22px; border-radius: 30px;
  background: color-mix(in srgb, var(--surface) 86%, transparent); backdrop-filter: saturate(150%) blur(18px);
  border: 1px solid color-mix(in srgb, #fff 60%, var(--line)); box-shadow: var(--shadow-card);
}
.picker__head { padding: 4px 6px 16px; }
.picker__kicker { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-deep); }
.picker__title { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.25rem, 1.8vw, 1.55rem); line-height: 1.15; margin-top: 4px; }
.picker__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.picker__wide { grid-column: 1 / -1; }
.picker__grid a {
  display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 18px; min-width: 0;
  background: var(--surface); border: 1px solid var(--line);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.picker__grid a:hover { transform: translateY(-2px); border-color: var(--gold-deep); box-shadow: 0 14px 30px -18px rgba(138, 91, 23, .6); }
.picker__ico { display: grid; place-items: center; width: 54px; height: 54px; flex: none; border-radius: 15px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.picker__txt { min-width: 0; flex: 1; }
.picker__txt strong { display: block; font-size: .95rem; line-height: 1.2; }
.picker__txt small { display: block; font-size: .76rem; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.picker__go { color: var(--gold-deep); transition: transform .18s ease; }
.picker__grid a:hover .picker__go { transform: translateX(3px); }
.picker__ipo {
  display: flex; align-items: center; gap: 12px; margin-top: 10px; padding: 12px 16px; border-radius: 16px;
  background: #0B0B0C; color: var(--text-on-dark); font-size: .84rem;
}
.picker__ipo span:nth-child(2) { flex: 1; min-width: 0; }
.picker__ipo:hover { background: #17120A; }
.livepill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(245, 194, 94, .16); color: var(--gold); font-family: var(--font-mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.livepill i { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); animation: pulse 2s ease-in-out infinite; }

.ticker__more { flex: none; display: flex; align-items: center; padding: 0 var(--gutter) 0 18px; font-size: .78rem; font-weight: 600; color: var(--gold); border-left: 1px solid rgba(247, 241, 226, .12); white-space: nowrap; }

/* ---------- services grid — the homepage's main event ---------- */
.sec--services { background: linear-gradient(180deg, var(--bg-warm), var(--bg)); }
.svcgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.svcgrid--even .svc--featured { grid-column: auto; grid-row: auto; }
.svc {
  position: relative; border-radius: var(--r-card); background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-soft); overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.svc::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--cta-from), var(--cta-to)); transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.svc:hover { transform: translateY(-5px); box-shadow: var(--shadow-lift); border-color: color-mix(in srgb, var(--gold-deep) 45%, var(--line)); }
.svc:hover::before { transform: scaleX(1); }
.svc__link { display: flex; flex-direction: column; height: 100%; padding: 24px 22px 22px; }
.svc__num { position: absolute; top: 20px; right: 22px; font-size: .7rem; letter-spacing: .1em; color: var(--slate); }
.svc__ico { display: grid; place-items: center; width: 84px; height: 84px; margin-bottom: 18px; border-radius: 24px; background: radial-gradient(90% 90% at 30% 20%, color-mix(in srgb, var(--gold) 26%, var(--surface)), color-mix(in srgb, var(--gold) 9%, var(--surface))); }
.svc h3 { font-size: 1.28rem; margin-bottom: 8px; }
.svc p { font-size: .9rem; color: var(--text-soft); }
.svc__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 18px; }
.svc__tags li { font-size: .7rem; padding: 4px 10px; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--text-soft); white-space: nowrap; }
.svc .link-gold { margin-top: auto; }
.svc--featured { grid-column: span 2; grid-row: span 2; background: radial-gradient(120% 90% at 100% 100%, color-mix(in srgb, var(--gold) 24%, var(--surface)), var(--surface) 60%); }
.svc--featured .svc__link { padding: 32px 30px 28px; }
.svc--featured .svc__ico { width: 116px; height: 116px; border-radius: 32px; }
.svc--featured h3 { font-size: clamp(1.7rem, 2.4vw, 2.3rem); }
.svc--featured p { font-size: 1.02rem; max-width: 36ch; }
.svc--cta { grid-column: span 2; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 28px; background: radial-gradient(120% 120% at 100% 100%, #2A1D08 0%, #0B0B0C 62%); color: var(--text-on-dark); border-color: transparent; }
.svc--cta .svc__num { position: static; color: var(--gold); }
.svc--cta h3 { color: #fff; font-size: 1.5rem; }
.svc--cta p { color: rgba(247, 241, 226, .76); max-width: 46ch; margin-bottom: 8px; }
.svc__phone { font-size: .9rem; color: var(--gold); margin-top: 4px; }

/* ---------- steps ---------- */
.steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; counter-reset: s; }
.step { position: relative; padding: 26px 24px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.step__n { position: absolute; top: 22px; right: 24px; font-size: 1.5rem; font-weight: 600; color: color-mix(in srgb, var(--gold-deep) 30%, transparent); }
.step__ico { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; margin-bottom: 18px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.step h3 { margin-bottom: 6px; }
.step p { font-size: .9rem; color: var(--text-soft); }
.step--cta { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 14px; background: linear-gradient(150deg, color-mix(in srgb, var(--gold) 26%, var(--surface)), var(--surface)); }
.step__fee { font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; }
.step__fee .mono { display: block; font-size: 2.6rem; line-height: 1; color: var(--gold-deep); }

/* ---------- platform (dark band) ---------- */
.sec--platform { background: linear-gradient(135deg, #071018, #0F2235); color: var(--text-on-dark); overflow: hidden; }
.platform { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.platform--flip .platform__device { order: -1; }
.platform h2 { color: #fff; margin-top: 10px; }
.platform__lede { margin: 18px 0 28px; max-width: 52ch; color: rgba(247, 241, 226, .78); }
.ways { display: grid; gap: 14px; }
.ways li { display: flex; gap: 16px; align-items: flex-start; padding: 16px; border-radius: 18px; background: rgba(247, 241, 226, .05); border: 1px solid rgba(247, 241, 226, .09); }
.ways__ico { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: rgba(245, 194, 94, .12); flex: none; }
.ways h3 { color: #fff; font-size: 1.05rem; margin-bottom: 3px; }
.ways p { font-size: .88rem; color: rgba(247, 241, 226, .72); }
.platform__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.platform__device { display: flex; justify-content: center; position: relative; }
.platform__device::before { content: ''; position: absolute; inset: 8% -10%; background: radial-gradient(50% 50% at 50% 55%, rgba(217, 164, 65, .35), transparent 70%); }
.platform__device .phone { width: min(260px, 70vw); }
.platform__device .phone__screen { padding: 16px 16px 14px; border-radius: 34px; }
.platform__device .phone__val { font-size: 1.4rem; }
.platform__device .phone__greet { font-size: 1.2rem; }
.platform__device .phone__idx, .platform__device .phone__chg, .platform__device .phone__listhead { font-size: .72rem; }
.platform__device .phone__list p { font-size: .68rem; padding: 4px 0; }
.platform__device .phone__tabs { font-size: .6rem; }
.platform__device .phone__brand { font-size: 1rem; }
.bopanel { position: relative; width: min(360px, 100%); padding: 22px; border-radius: 24px; background: rgba(247, 241, 226, .06); border: 1px solid rgba(247, 241, 226, .12); }
.bopanel__t { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); margin-bottom: 12px; }
.bopanel li { display: flex; justify-content: space-between; padding: 13px 0; border-top: 1px solid rgba(247, 241, 226, .1); font-size: .9rem; }
.bopanel i { font-style: normal; font-family: var(--font-mono); font-size: .68rem; padding: 3px 9px; border-radius: 999px; background: rgba(245, 194, 94, .14); color: var(--gold); }

/* ---------- why / proof ---------- */
.proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 22px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.proof__stat { padding: 26px clamp(16px, 2.4vw, 32px); border-left: 1px solid var(--line); }
.proof__stat:first-child { border-left: 0; }
.proof__val { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1; color: var(--text); }
.proof__val span { color: var(--gold-deep); }
.proof__stat p:last-child { margin-top: 6px; font-size: .88rem; color: var(--text-soft); }
.sec--why { padding-bottom: var(--rhythm); }
.value { align-items: flex-start; }
.value__ico { display: grid; place-items: center; width: 64px; height: 64px; flex: none; border-radius: 18px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.sec--snapshot { background: var(--bg); border-block: 1px solid var(--line); }

/* post tones */
.post__img--green { background: linear-gradient(140deg, #DCE7C8, #8FAE6B 55%, #47632F); }
.post__img--ink { background: linear-gradient(140deg, #25323D, #0D1016 60%, #2A1D08); }
.post__img--gold { background: linear-gradient(140deg, #F1E0BC, #C8912F 60%, #6D5324); }
.post__title { font-family: var(--font-display); font-size: 1.24rem; line-height: 1.2; margin-bottom: 10px; }

/* ---------- lead capture ---------- */
.leadwrap { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.leadwrap__copy h2 { margin: 10px 0 16px; }
.leadwrap__copy > p { color: var(--text-soft); max-width: 46ch; }
.leadwrap__list { display: grid; gap: 12px; margin-top: 24px; }
.leadwrap__list li { display: flex; align-items: center; gap: 12px; font-weight: 500; }
.leadwrap__list a:hover { color: var(--gold-deep); }
.ministeps { display: grid; gap: 10px; margin: 22px 0 26px; }
.ministeps li { display: flex; align-items: center; gap: 12px; font-size: .95rem; }
.ministeps span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: color-mix(in srgb, var(--gold) 30%, transparent); font-size: .78rem; font-weight: 600; color: var(--navy); }

.lead { padding: clamp(22px, 3vw, 34px); border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lift); }
.lead__title { font-size: 1.5rem !important; line-height: 1.15; }
.lead__head p { margin-top: 6px; font-size: .9rem; color: var(--text-soft); }
.lead__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 20px 0 16px; }
.fld { display: grid; gap: 6px; min-width: 0; }
.fld--full { grid-column: 1 / -1; }
.fld > span { font-size: .8rem; font-weight: 600; }
.fld i { font-style: normal; font-weight: 400; color: var(--slate); }
.fld input, .fld select, .fld textarea {
  width: 100%; min-width: 0; padding: 13px 14px; border-radius: 14px; font: inherit; font-size: .95rem;
  color: var(--text); background: var(--bg); border: 1px solid var(--line);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.fld input:focus, .fld select:focus, .fld textarea:focus { outline: 0; border-color: var(--gold-deep); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 35%, transparent); }
.fld .is-invalid, .lead__consent .is-invalid { border-color: var(--loss); box-shadow: 0 0 0 3px color-mix(in srgb, var(--loss) 20%, transparent); }
.lead__consent { display: flex; gap: 10px; align-items: flex-start; font-size: .78rem; color: var(--text-soft); line-height: 1.5; }
.lead__consent input { margin-top: 3px; accent-color: var(--gold-deep); width: 16px; height: 16px; flex: none; }
.lead__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 18px; }
.lead__note { font-size: .8rem; color: var(--slate); }
.lead__note.is-error { color: var(--loss); font-weight: 500; }
.lead__note.is-ok { color: var(--gain); font-weight: 500; }

.finalcta { margin-top: 0; }
.finalcta__alt { font-size: .84rem; color: rgba(247, 241, 226, .75); text-decoration: underline; text-underline-offset: 3px; }
.finalcta__alt:hover { color: var(--gold); }

/* ---------- inner-page hero ---------- */
.phero { position: relative; overflow: hidden; background: radial-gradient(70% 120% at 100% 0%, color-mix(in srgb, var(--gold) 30%, var(--bg-warm)), var(--bg-warm) 62%); border-bottom: 1px solid var(--line); }
.phero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(24px, 4vw, 64px); align-items: center; padding-block: clamp(36px, 5vw, 72px) clamp(44px, 6vw, 84px); }
.phero h1 { font-size: clamp(2.2rem, 5vw, 4.2rem); line-height: 1.02; }
.phero h1 em { font-style: normal; background: linear-gradient(120deg, var(--cta-from), var(--cta-to)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.phero__lede { margin-top: 20px; max-width: 58ch; font-size: clamp(1rem, 1.2vw, 1.14rem); color: var(--text-soft); }
.phero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.phero__cta:empty { display: none; }
.phero__side { display: flex; justify-content: center; }
.phero__side:empty { display: none; }
.phero__arc { position: absolute; inset: auto 0 0 0; width: 100%; height: 70%; color: var(--bronze); opacity: .22; pointer-events: none; }
.phero__emblem { position: relative; display: grid; place-items: center; width: clamp(200px, 24vw, 320px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--surface), color-mix(in srgb, var(--gold) 22%, var(--surface))); box-shadow: var(--shadow-card); }
.phero__emblem .uico { width: 52%; height: 52%; }
.phero__ring { position: absolute; inset: -18px; border-radius: 50%; border: 1px dashed color-mix(in srgb, var(--gold-deep) 45%, transparent); }
.phero__facts { display: grid; gap: 12px; width: 100%; max-width: 340px; }
.phero__facts li { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); font-size: .92rem; color: var(--text-soft); }
.phero__facts strong { color: var(--text); font-family: var(--font-mono); margin-right: 4px; }

.crumbs { margin-bottom: 22px; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; font-size: .8rem; color: var(--slate); }
.crumbs li + li::before { content: '/'; margin-right: 6px; opacity: .5; }
.crumbs a:hover { color: var(--gold-deep); }
.crumbs [aria-current] { color: var(--text); font-weight: 500; }

/* ---------- stat band ---------- */
.statband { background: #0B0B0C; color: var(--text-on-dark); }
.statband__inner { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.statband__item { padding: 26px clamp(12px, 2vw, 28px); border-left: 1px solid rgba(247, 241, 226, .1); min-width: 0; }
.statband__item:first-child { border-left: 0; padding-left: 0; }
.statband__val { font-size: clamp(1.15rem, 2.2vw, 1.9rem); font-weight: 600; color: var(--gold); overflow-wrap: anywhere; }
.statband__cap { font-size: .84rem; color: rgba(247, 241, 226, .7); margin-top: 2px; }

/* ---------- feature cards ---------- */
.feats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.feats--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.feat { position: relative; padding: 30px 28px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); display: flex; flex-direction: column; }
.feat__n { font-size: .74rem; letter-spacing: .1em; color: var(--gold-deep); margin-bottom: 12px; }
.feat__ico { display: grid; place-items: center; width: 92px; height: 92px; border-radius: 26px; margin-bottom: 20px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.feat h3 { font-size: 1.35rem; margin-bottom: 8px; }
.feat > p { color: var(--text-soft); font-size: .94rem; }
.feat .link-gold { margin-top: auto; padding-top: 18px; }
.ticks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.feats--three .ticks { grid-template-columns: 1fr; }
.ticks li { position: relative; padding-left: 24px; font-size: .86rem; color: var(--text); }
.ticks li::before { content: ''; position: absolute; left: 0; top: .42em; width: 13px; height: 7px; border-left: 2px solid var(--gold-deep); border-bottom: 2px solid var(--gold-deep); transform: rotate(-45deg); transform-origin: left bottom; translate: 4px -2px; }

.riskband { background: color-mix(in srgb, var(--gold) 14%, var(--bg)); border-block: 1px solid color-mix(in srgb, var(--gold-deep) 30%, var(--line)); }
.riskband__inner { display: flex; gap: 18px; align-items: flex-start; padding-block: 24px; }
.riskband__label { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--bronze); margin-bottom: 4px; }
.riskband p:last-child { font-size: .86rem; line-height: 1.6; color: var(--text); max-width: 120ch; }

/* ---------- FAQ ---------- */
.sec--faq { background: var(--bg); border-block: 1px solid var(--line); }
.faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(24px, 5vw, 80px); }
.faq__head h2 { margin: 10px 0 14px; font-size: clamp(1.7rem, 3vw, 2.5rem); }
.faq__head p { color: var(--text-soft); }
.faq__list { display: grid; gap: 10px; }
.faq__item { border-radius: 20px; background: var(--surface); border: 1px solid var(--line); }
.faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px; cursor: pointer; list-style: none; font-weight: 600; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary i { position: relative; width: 28px; height: 28px; flex: none; border-radius: 50%; background: color-mix(in srgb, var(--gold) 25%, transparent); }
.faq__item summary i::before, .faq__item summary i::after { content: ''; position: absolute; left: 8px; right: 8px; top: 13px; height: 2px; background: var(--bronze); transition: transform .2s ease; }
.faq__item summary i::after { transform: rotate(90deg); }
.faq__item[open] summary i::after { transform: rotate(0); }
.faq__item p { padding: 0 22px 22px; color: var(--text-soft); font-size: .94rem; max-width: 72ch; }

/* ---------- related / tool rows ---------- */
.relgrid, .toolgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.toolgrid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rel, .tool { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); transition: transform .2s ease, border-color .2s ease; min-width: 0; }
.rel:hover, .tool:hover { transform: translateY(-3px); border-color: var(--gold-deep); }
.rel__ico, .tool__ico { display: grid; place-items: center; width: 68px; height: 68px; flex: none; border-radius: 18px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.rel > span:nth-child(2), .tool > span:nth-child(2) { flex: 1; min-width: 0; }
.rel strong, .tool strong { display: block; font-family: var(--font-display); font-size: 1.1rem; }
.rel small, .tool small { display: block; font-size: .82rem; color: var(--text-soft); line-height: 1.45; }
.rel__go { color: var(--gold-deep); }

/* ---------- comparison table ---------- */
.cmp { width: 100%; border-collapse: collapse; min-width: 720px; font-size: .9rem; }
.cmp th, .cmp td { text-align: left; padding: 16px 20px; border-top: 1px solid var(--line); vertical-align: top; }
.cmp thead th { border-top: 0; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--bronze); font-weight: 500; background: var(--bg); }
.cmp tbody th a { font-family: var(--font-display); font-size: 1.05rem; color: var(--text); }
.cmp tbody th a:hover { color: var(--gold-deep); }
.cmp td { color: var(--text-soft); }

/* ---------- about ---------- */
.story { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.story h2 { margin-top: 10px; }
.story__side { margin-top: 16px; font-size: .88rem; color: var(--text-soft); }
.story__body { display: grid; gap: 16px; }
.story__body > p { font-size: 1.04rem; color: var(--text-soft); max-width: 68ch; }
.story__body a:not(.btn) { color: var(--gold-deep); text-decoration: underline; text-underline-offset: 3px; }
.pillrow { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.pillrow li { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px 9px 10px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); font-size: .88rem; font-weight: 500; }
.sec--vmv, .sec--regs { background: var(--bg); border-block: 1px solid var(--line); }
.vmv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.vmv__card { padding: 32px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.vmv__card--dark { background: radial-gradient(120% 120% at 100% 100%, #2A1D08 0%, #0B0B0C 62%); color: var(--text-on-dark); border-color: transparent; }
.vmv__card--dark h3 { color: #fff; }
.vmv__card--dark p { color: rgba(247, 241, 226, .8); }
.vmv__card--wide { grid-column: 1 / -1; }
.vmv__ico { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 19px; margin-bottom: 16px; }
.vmv__card h3 { font-size: 1.5rem; margin-bottom: 10px; }
.vmv__card p { color: var(--text-soft); font-size: 1rem; }
.valueslist { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-top: 8px; }
.valueslist li { padding-top: 14px; border-top: 2px solid var(--gold-deep); }
.valueslist strong { display: block; font-family: var(--font-display); font-size: 1.05rem; margin-bottom: 4px; }
.valueslist span { font-size: .86rem; color: var(--text-soft); }
.people { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.person { display: flex; align-items: center; gap: 18px; padding: 24px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.person__avatar { display: grid; place-items: center; width: 72px; height: 72px; flex: none; border-radius: 50%; background: linear-gradient(140deg, var(--cta-from), var(--cta-to)); color: #FFF8EA; font-family: var(--font-display); font-size: 1.4rem; font-weight: 700; }
.person h3 { font-size: 1.2rem; }
.person p { color: var(--text-soft); font-size: .9rem; }
.reggrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.regcard { padding: 20px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); min-width: 0; }
.regcard .mark { margin-bottom: 14px; }
.regcard__label { font-weight: 600; font-size: .92rem; }
.regcard__id { font-size: .88rem; color: var(--gold-deep); font-weight: 600; margin: 2px 0 6px; overflow-wrap: anywhere; }
.regcard__note { font-size: .78rem; color: var(--text-soft); }
.mark--nsdl { color: #7A1F2B; } .mark--amfi { color: #0B6B4F; } .mark--cdsl { color: #1B3A93; }

/* ---------- contact ---------- */
.contactfast { display: grid; gap: 10px; width: 100%; max-width: 400px; }
.contactfast a { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); min-width: 0; }
.contactfast a:hover { border-color: var(--gold-deep); }
.contactfast span { min-width: 0; }
.contactfast small { display: block; font-size: .74rem; color: var(--text-soft); }
.contactfast strong { display: block; font-size: .95rem; overflow-wrap: anywhere; }
.contactgrid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.offices { display: grid; gap: 16px; }
.office { display: flex; gap: 18px; padding: 24px; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.office__ico { display: grid; place-items: center; width: 60px; height: 60px; flex: none; border-radius: 16px; background: color-mix(in srgb, var(--gold) 15%, var(--surface)); }
.office__label { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--bronze); }
.office h2 { font-size: 1.4rem; margin: 2px 0 8px; }
.office address, .office p { font-style: normal; font-size: .9rem; color: var(--text-soft); line-height: 1.6; }
.office .link-gold { margin-top: 10px; }
.sec--escalate { background: var(--bg); border-top: 1px solid var(--line); }
.escalate { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); overflow: hidden; }
.escalate li { position: relative; padding: 26px 24px; border-left: 1px solid var(--line); min-width: 0; }
.escalate li:first-child { border-left: 0; }
.escalate li span { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--bronze); }
.escalate h3 { margin: 6px 0 8px; }
.escalate p { font-size: .86rem; color: var(--text-soft); overflow-wrap: anywhere; line-height: 1.7; }
.escalate a:hover, .figures-note a { color: var(--gold-deep); text-decoration: underline; }

/* ---------- client tools / legal ---------- */
.checklist { display: grid; gap: 10px; }
.checklist li { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); font-size: .94rem; color: var(--text-soft); }
.checklist strong { color: var(--text); }
.notice { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; border-radius: 18px; background: color-mix(in srgb, var(--gold) 16%, var(--surface)); border: 1px solid color-mix(in srgb, var(--gold-deep) 35%, transparent); }
.notice p { font-size: .9rem; color: var(--text); }
.legalgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: start; }
.legalcol ul { display: grid; gap: 8px; }
.doc { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); font-size: .9rem; font-weight: 500; }
.doc span { flex: 1; min-width: 0; }
.doc i { font-style: normal; font-size: .62rem; padding: 3px 8px; border-radius: 999px; background: var(--bg); border: 1px solid var(--line); color: var(--slate); }
.doc:hover { border-color: var(--gold-deep); color: var(--gold-deep); }
:target { scroll-margin-top: 120px; }
li:target > .doc { border-color: var(--gold-deep); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 35%, transparent); }

/* ---------- sitemap page ---------- */
.smhome { display: flex; align-items: center; gap: 16px; padding: 22px 26px; margin-bottom: 18px; border-radius: var(--r-card); background: radial-gradient(120% 120% at 100% 100%, #2A1D08 0%, #0B0B0C 62%); color: var(--text-on-dark); }
.smhome .uico { color: #F7F1E2; }
.smhome strong { display: block; font-family: var(--font-display); font-size: 1.4rem; color: #fff; }
.smhome small { font-size: .84rem; color: rgba(247, 241, 226, .72); }
.smgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.smcol { border-radius: var(--r-card); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-soft); overflow: hidden; }
.smcol header { display: flex; align-items: center; gap: 12px; padding: 18px 20px; border-bottom: 1px solid var(--line); background: var(--bg); }
.smcol header .mono { font-size: .74rem; color: var(--gold-deep); }
.smcol h2 { font-size: 1.15rem; }
.smcol ul { padding: 8px; }
.smcol a { display: block; padding: 10px 12px; border-radius: 12px; font-size: .92rem; font-weight: 500; }
.smcol a:hover { background: var(--bg); color: var(--gold-deep); }
.smcol small { display: block; font-size: .78rem; font-weight: 400; color: var(--text-soft); }
.smcol i { font-style: normal; color: var(--slate); }

.notfound { text-align: left; }
.notfound__code { font-size: clamp(4rem, 12vw, 9rem); font-weight: 600; line-height: 1; background: linear-gradient(120deg, var(--cta-from), var(--cta-to)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.notfound h1 { font-size: clamp(1.8rem, 4vw, 3rem); margin: 8px 0 12px; }
.notfound h1 em { font-style: normal; color: var(--gold-deep); }
.notfound > .wrap > p { color: var(--text-soft); margin-bottom: 26px; }

/* ---------- footer additions ---------- */
.footer { padding-top: 64px; }
.footer__col h2 { font-family: var(--font-body); font-size: .76rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); padding-bottom: 10px; margin-bottom: 14px; border-bottom: 1px solid rgba(217, 164, 65, .3); }
.footer__contact li span { display: block; min-width: 0; }
.footer__contact small { display: block; font-size: .78rem; color: rgba(247, 241, 226, .5); line-height: 1.5; margin-top: 2px; }
.footer__contact a { overflow-wrap: anywhere; }
.footer__contact .uico { margin-top: 2px; }
.compliance__regs { padding-bottom: 14px; }
.compliance__grievance { padding: 14px 0; border-top: 1px solid rgba(247, 241, 226, .08); font-size: .8rem; color: rgba(247, 241, 226, .7); line-height: 1.8; }
.compliance__grievance a { color: var(--gold); }
.compliance__grievance strong { color: #fff; font-weight: 600; }
.compliance__more { border-top: 1px solid rgba(247, 241, 226, .08); padding: 12px 0; }
.compliance__more summary { cursor: pointer; font-size: .8rem; font-weight: 600; color: rgba(247, 241, 226, .8); }
.compliance__more p { margin-top: 10px; font-size: .76rem; line-height: 1.7; color: rgba(247, 241, 226, .55); max-width: 130ch; }
.compliance__more strong { color: rgba(247, 241, 226, .85); font-weight: 600; }
.compliance__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding-top: 14px; border-top: 1px solid rgba(247, 241, 226, .08); }

/* ---------- mobile sticky CTA ---------- */
.stickycta { display: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
  .edhead--two, .platform, .leadwrap, .faq, .story, .contactgrid, .phero__inner { grid-template-columns: 1fr; }
  .platform--flip .platform__device { order: 0; }
  .svcgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svc--featured { grid-row: auto; }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feats--three, .relgrid, .toolgrid, .legalgrid, .smgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reggrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .valueslist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .escalate { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .escalate li:nth-child(3) { border-left: 0; }
  .escalate li:nth-child(n+3) { border-top: 1px solid var(--line); }
  .phero__side { justify-content: flex-start; }
  .phero__emblem { display: none; }
  .hero--services .hero__visual { justify-content: stretch; }
  .picker { width: 100%; }
  .topbar__links li:nth-child(n+3) { display: none; }
}

@media (max-width: 760px) {
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .stickycta {
    position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; display: flex; gap: 10px; align-items: center;
    padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(14px);
    border-top: 1px solid var(--line); box-shadow: 0 -12px 30px -18px rgba(16, 34, 46, .4);
  }
  .stickycta__call { display: inline-flex; align-items: center; gap: 8px; padding: 13px 16px; border-radius: var(--r-btn); border: 1px solid var(--line); font-weight: 600; font-size: .9rem; white-space: nowrap; }
  .stickycta__call svg { width: 18px; height: 18px; }
  .stickycta .btn { flex: 1; padding-inline: 14px; }
  .nav__actions .btn--gold { display: none; }
  .topbar__reg { font-size: .62rem; }
  .svcgrid, .steps, .feats, .feats--three, .relgrid, .toolgrid, .toolgrid--two, .legalgrid, .smgrid, .vmv, .lead__grid { grid-template-columns: 1fr; }
  .svc--featured, .svc--cta { grid-column: auto; }
  .svc--featured .svc__link { padding: 24px 22px; }
  .svc--featured .svc__ico { width: 84px; height: 84px; border-radius: 24px; }
  .proof, .statband__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .proof__stat:nth-child(3), .statband__item:nth-child(3) { border-left: 0; }
  .proof__stat:nth-child(n+3) { border-top: 1px solid var(--line); }
  .statband__item:nth-child(n+3) { border-top: 1px solid rgba(247, 241, 226, .1); }
  .statband__item:nth-child(odd) { padding-left: 0; }
  .reggrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ticks { grid-template-columns: 1fr; }
  .feat { padding: 24px 20px; }
  .vmv__card { padding: 24px; }
  .mobile-menu__cta .btn--gold { display: inline-flex; }
  .ticker__more { display: none; }
}

@media (max-width: 400px) {
  .picker { padding: 14px; border-radius: 22px; }
  .picker__grid { grid-template-columns: 1fr; }
  .picker__ico { width: 46px; height: 46px; border-radius: 13px; }
  .picker__ico .uico { width: 32px; height: 32px; }
  .picker__ipo { flex-wrap: wrap; font-size: .78rem; }
  .svc__ico { width: 68px; height: 68px; border-radius: 20px; }
  .phero h1 { font-size: clamp(1.8rem, 9.5vw, 2.3rem); }
  .valueslist, .escalate, .reggrid { grid-template-columns: 1fr; }
  .escalate li { border-left: 0; border-top: 1px solid var(--line); }
  .escalate li:first-child { border-top: 0; }
  .mobile-menu__services { grid-template-columns: 1fr; }
  .office { flex-direction: column; gap: 12px; padding: 20px; }
  .rel__ico, .tool__ico { width: 54px; height: 54px; }
  .rel, .tool { padding: 14px; gap: 12px; }
  .stickycta__call span, .stickycta__call { font-size: .82rem; padding-inline: 12px; }
  .proof__stat { padding: 18px 14px; }
}

@media (max-width: 300px) {
  .proof, .statband__inner { grid-template-columns: 1fr; }
  .proof__stat, .statband__item { border-left: 0 !important; padding-left: 0; }
  .stickycta__call { display: none; }
  .topbar { display: none; }
}

/* ---------- fixes after first visual pass ---------- */
ol { list-style: none; margin: 0; padding: 0; }
.svc--featured .svc__tags { display: none; }
.svc__points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 26px 0 24px; position: relative; z-index: 1; }
.svc__points li { padding: 14px 16px; border-radius: 16px; background: color-mix(in srgb, var(--surface) 80%, transparent); border: 1px solid var(--line); backdrop-filter: blur(6px); }
.svc__points strong { display: block; font-size: .92rem; }
.svc__points span { display: block; font-size: .8rem; color: var(--text-soft); margin-top: 2px; }
.svc__ghost { position: absolute; right: -40px; bottom: -50px; opacity: .1; pointer-events: none; }
.svc--featured .svc__link > *:not(.svc__ghost):not(.svc__num) { position: relative; z-index: 1; }
@media (max-width: 760px) { .svc__points { grid-template-columns: 1fr; } .svc__ghost { display: none; } }
.story > *, .leadwrap > *, .contactgrid > *, .faq > *, .platform > *, .phero__inner > *, .legalgrid > *, .smgrid > * { min-width: 0; }
.story__body, .notice p, .office address { overflow-wrap: anywhere; }
.nav__actions { margin-left: auto; }
@media (max-width: 1180px) { .nav__menu { display: none; } }
@media (max-width: 400px) { .btn { white-space: normal; text-align: center; } .btnrow .btn, .phero__cta .btn { width: 100%; } }
.vmv__card.vmv__card--dark p { color: rgba(247, 241, 226, .82); }


/* ==========================================================================
   Typography — Urja voice
   Heebo 800 headlines (the wordmark's own weight), Heebo text, tabular Heebo
   figures. One family only: the gold phrase in a headline is the same Heebo 800, in gold.
   ========================================================================== */
body { font-feature-settings: 'kern', 'liga', 'tnum'; letter-spacing: -.003em; }
h1, h2 { font-weight: 800; letter-spacing: -.035em; }
h3, h4 { font-weight: 700; letter-spacing: -.018em; }
.hero__copy h1 { line-height: 1; letter-spacing: -.045em; }
.sec h2, .phero h1, .finalcta h2 { line-height: 1.04; }

.hero__copy h1 em, .sec h2 em, .finalcta h2 em, .phero h1 em, .notfound h1 em, h2 em, h3 em {
  font-family: var(--font-display); font-style: normal; font-weight: 800;
  letter-spacing: inherit; font-size: 1em; line-height: inherit;
  padding-inline-end: .08em; /* keeps the italic overhang inside the gradient clip */
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

.mono { font-family: var(--font-body); font-variant-numeric: tabular-nums lining-nums; letter-spacing: 0; }
.eyebrow { font-family: var(--font-body); font-weight: 600; font-size: .74rem; letter-spacing: .18em; }
.hero__note, .figures-note, .mcard__disclosure, .terminal__credit, .terminal__note,
.finalcta__sub, .finalcta__sign, .quicklinks__label, .app__note, .footer__entity,
.livepill, .bopanel i, .cmp thead th { font-family: var(--font-body); }
.quotecard p, .pullquote p, blockquote p { font-family: var(--font-body); font-style: normal; font-weight: 500; letter-spacing: -.015em; }
.quotecard cite, .pullquote cite { font-family: var(--font-body); font-weight: 600; }
.trust__big, .proof__val, .metric__val, .statband__val { font-family: var(--font-display); font-weight: 800; letter-spacing: -.04em; font-variant-numeric: tabular-nums lining-nums; }
.trust__big--reg { font-family: var(--font-body); font-weight: 700; letter-spacing: -.01em; }
.btn { font-weight: 600; letter-spacing: -.005em; }
.nav__menu a, .nav__menu button { font-weight: 500; }


/* ==========================================================================
   Home — About. A navy registration plate (leaf-cornered, like the mark)
   beside the company story. Copy comes from the live About page.
   ========================================================================== */
.sec--about { background: var(--bg); border-block: 1px solid var(--line); }
.abt { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(28px, 5vw, 88px); align-items: center; }
.abt > * { min-width: 0; }
.abt__plate { order: -1; }

.abt__story h2 { margin: 12px 0 22px; }
.abt__story > p { color: var(--text-soft); max-width: 66ch; margin-bottom: 14px; }
.abt__story > p.abt__lead { font-size: clamp(1.05rem, 1.3vw, 1.2rem); color: var(--text); line-height: 1.55; }
.abt__story > p a { color: var(--gold-deep); font-weight: 500; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--gold-deep) 35%, transparent); text-underline-offset: 3px; }
.abt__story > p a:hover { text-decoration-color: currentColor; }

.abt__vision { margin: 26px 0; padding: 4px 0 4px clamp(18px, 2vw, 28px); border-left: 3px solid; border-image: linear-gradient(180deg, var(--cta-from), var(--cta-to)) 1; }
.abt__vision p { font-size: clamp(1.2rem, 1.9vw, 1.65rem); line-height: 1.32; color: var(--text); max-width: 34ch; }
.abt__vision cite { display: block; margin-top: 12px; font-style: normal; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--bronze); }

.abt__principles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; margin-bottom: 30px; }
.abt__principles li { display: flex; gap: 14px; align-items: flex-start; min-width: 0; }
.abt__pico { display: grid; place-items: center; width: 50px; height: 50px; flex: none; border-radius: 4px 16px 4px 16px; }
.abt__principles strong { display: block; font-size: .98rem; }
.abt__principles small { display: block; font-size: .85rem; line-height: 1.45; color: var(--text-soft); }

.abt__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.abt__board { margin-left: auto; font-size: .88rem; color: var(--text-soft); text-align: right; }
.abt__board span { display: block; font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--bronze); }

/* the plate */
.abt__plate {
  position: relative; isolation: isolate; overflow: hidden;
  padding: clamp(26px, 3.4vw, 48px);
  border-radius: 8px clamp(40px, 5vw, 72px) 8px clamp(40px, 5vw, 72px);
  background: linear-gradient(155deg, #1B3344 0%, #10222E 46%, #070F15 100%);
  border: 1px solid rgba(245, 194, 94, .3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 40px 80px -36px rgba(7, 16, 24, .7);
  color: var(--text-on-dark);
}
.abt__plate::after { content: ''; position: absolute; inset: 9px; z-index: -1; border-radius: 4px clamp(32px, 4.4vw, 64px) 4px clamp(32px, 4.4vw, 64px); border: 1px solid rgba(245, 194, 94, .14); pointer-events: none; }
.abt__blades {
  position: absolute; z-index: -1; right: -14%; top: -6%; width: 78%; aspect-ratio: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23F5C25E' d='M38 5C20 25 28 45 50 60c16 11 20 22 12 37 22-17 22-39 0-55C44 29 34 20 38 5ZM18 45C8 58 14 70 28 79c10 7 12 13 9 21 13-12 11-24-1-33-12-9-19-14-18-22Z'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .07;
}
.abt__kicker { font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.abt__years {
  margin-top: 10px; font-family: var(--font-display); font-weight: 800; line-height: .86; letter-spacing: -.06em;
  font-size: clamp(5.4rem, 10.5vw, 10rem);
  background: linear-gradient(135deg, #FFE9B0 0%, #F5C25E 38%, #B9822A 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.abt__years sup { font-size: .42em; vertical-align: top; position: relative; top: .12em; margin-left: .04em; letter-spacing: 0; }
.abt__yearscap { margin-top: 10px; font-size: 1.02rem; color: rgba(247, 241, 226, .82); max-width: 24ch; }

.abt__ledger { margin: clamp(22px, 3vw, 34px) 0 0; border-top: 1px solid rgba(245, 194, 94, .28); }
.abt__ledger div { display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: baseline; gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(247, 241, 226, .1); }
.abt__ledger dt { font-weight: 800; font-size: .86rem; letter-spacing: .06em; color: var(--gold); }
.abt__ledger dd { margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 14px; font-size: .9rem; color: rgba(247, 241, 226, .86); min-width: 0; }
.abt__ledger dd .mono { font-weight: 600; color: #fff; }

.abt__motto { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; margin-top: 22px; }
.abt__motto em { font-family: var(--font-display); font-style: normal; font-size: 1.15rem; font-weight: 700; letter-spacing: -.02em; color: var(--gold); }
.abt__motto a { font-size: .84rem; font-weight: 600; color: rgba(247, 241, 226, .8); }
.abt__motto a:hover { color: var(--gold); }

@media (max-width: 1024px) {
  .abt { grid-template-columns: 1fr; }
  .abt__plate { order: 0; }
}
@media (max-width: 560px) {
  .abt__principles { grid-template-columns: 1fr; }
  .abt__board { margin-left: 0; text-align: left; flex-basis: 100%; }
  .abt__foot .btn { flex: 1 1 100%; }
  .abt__ledger div { grid-template-columns: 52px minmax(0, 1fr); }
}
@media (max-width: 340px) {
  .abt__ledger dd { font-size: .82rem; }
  .abt__years { font-size: 4.4rem; }
}


/* ==========================================================================
   Home — Urja Trade app download (light). Phone screens are redrawn from the
   real app: white UI, orange accent, green / red prices.
   ========================================================================== */
.sec--appx { background: linear-gradient(180deg, var(--bg-warm) 0%, #FBF3E1 100%); overflow: hidden; }
.appx { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(28px, 4.5vw, 80px); align-items: center; }
.appx > * { min-width: 0; }
.appx__copy h2 { margin-top: 12px; }
.appx__lede { margin: 18px 0 28px; max-width: 54ch; font-size: 1.04rem; color: var(--text-soft); }

/* download ticket */
.appx__get {
  display: flex; align-items: center; gap: clamp(16px, 2vw, 26px);
  padding: clamp(14px, 1.6vw, 20px); max-width: 560px;
  border-radius: 6px 30px 6px 30px; background: var(--surface);
  border: 1px solid rgba(176, 122, 35, .26);
  box-shadow: inset 0 1px 0 #fff, 0 26px 50px -30px rgba(138, 91, 23, .55);
}
.appx__qr {
  position: relative; flex: none; display: grid; place-items: center; padding: 10px;
  border-radius: 4px 18px 4px 18px; background: #fff; border: 1px solid var(--line);
}
.appx__qr::before, .appx__qr::after { content: ''; position: absolute; width: 18px; height: 18px; border: 2px solid var(--gold-deep); }
.appx__qr::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; border-radius: 4px 0 0 0; }
.appx__qr::after { right: -1px; bottom: -1px; border-left: 0; border-top: 0; border-radius: 0 0 4px 0; }
.appx__qr img { width: clamp(96px, 9vw, 132px); height: auto; display: block; }
.appx__getbody { min-width: 0; display: grid; gap: 12px; }
.appx__id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.appx__appicon {
  flex: none; display: grid; place-items: center; width: 138px; height: 66px; padding: 8px 12px;
  border-radius: 4px 16px 4px 16px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 8px 18px -10px rgba(16, 34, 46, .35);
}
.appx__appicon img { width: 100%; height: auto; }
.appx__id strong { display: block; font-size: 1.08rem; letter-spacing: -.02em; }
.appx__id small { display: block; font-size: .8rem; color: var(--text-soft); }
.appx__id p { min-width: 0; }
.playbtn {
  display: inline-flex; align-items: center; gap: 10px; justify-self: start;
  padding: 9px 18px 9px 14px; border-radius: 12px; background: var(--navy); color: #fff;
  border: 1px solid rgba(245, 194, 94, .45);
  box-shadow: 0 12px 22px -14px rgba(16, 34, 46, .8); transition: transform .18s ease, box-shadow .18s ease;
}
.playbtn:hover { transform: translateY(-2px); box-shadow: 0 16px 28px -14px rgba(16, 34, 46, .9); }
.playbtn svg { width: 24px; height: 24px; }
.playbtn span { display: grid; font-size: 1.02rem; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; }
.playbtn small { font-size: .6rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
.appx__scan { font-size: .8rem; color: var(--text-soft); }

.appx__also { display: flex; flex-wrap: wrap; gap: 10px 14px; margin-top: 24px; }
.appx__also a { display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: 999px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 70%, transparent); }
.appx__also a:hover { border-color: var(--gold-deep); }
.appx__also strong { display: block; font-size: .88rem; line-height: 1.2; }
.appx__also small { display: block; font-size: .74rem; color: var(--text-soft); }

/* stage */
.appx__stage {
  position: relative; isolation: isolate; display: flex; justify-content: center; align-items: flex-end;
  min-height: clamp(460px, 44vw, 640px); padding: clamp(28px, 4vw, 56px) clamp(12px, 3vw, 40px) 0;
  border-radius: 10px clamp(48px, 6vw, 96px) 10px clamp(48px, 6vw, 96px);
  background: linear-gradient(160deg, #FFFEFA 0%, #F8ECCF 62%, #EFD9A6 100%);
  border: 1px solid rgba(176, 122, 35, .24);
  box-shadow: inset 0 1px 0 #fff, 0 40px 80px -44px rgba(138, 91, 23, .6);
  overflow: hidden;
}
.appx__blades {
  position: absolute; z-index: -1; left: -8%; top: -10%; width: 70%; aspect-ratio: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23B07A23' d='M38 5C20 25 28 45 50 60c16 11 20 22 12 37 22-17 22-39 0-55C44 29 34 20 38 5ZM18 45C8 58 14 70 28 79c10 7 12 13 9 21 13-12 11-24-1-33-12-9-19-14-18-22Z'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .1;
}

/* handset — light aluminium frame, the app's own white UI */
.hp { --accent: #F47B20; --up: #2E9E4F; --dn: #D93025; position: relative; flex: none; width: clamp(200px, 19vw, 282px); }
.hp__screen {
  display: flex; flex-direction: column; height: clamp(410px, 39vw, 580px); overflow: hidden;
  border-radius: 34px 34px 0 0; background: #fff; color: #3A3F47;
  border: 7px solid #E9E2D2; border-bottom: 0; outline: 1px solid #C9BFA8;
  box-shadow: 0 -2px 0 #fff inset, 0 30px 60px -24px rgba(60, 40, 10, .45);
  font-size: clamp(.5rem, .68vw, .66rem); line-height: 1.25;
}
.hp--back { margin-left: clamp(-30px, -1.6vw, -14px); transform: translateY(9%); z-index: -1; }
.hp--back .hp__screen { filter: saturate(.92); }
.hp__status { display: flex; justify-content: space-between; align-items: center; padding: .45em 1.3em; background: #4A4D52; color: #E6E6E6; font-size: .92em; }
.hp__sig { display: inline-flex; align-items: flex-end; gap: 1.5px; }
.hp__sig i { display: block; width: 3px; background: #E6E6E6; border-radius: 1px; }
.hp__sig i:nth-child(1) { height: 4px; } .hp__sig i:nth-child(2) { height: 6px; } .hp__sig i:nth-child(3) { height: 8px; }
.hp__bar { display: flex; align-items: center; gap: 1em; padding: 1em 1.2em; border-bottom: 1px solid #ECEFF3; }
.hp__bar strong { font-size: 1.5em; font-weight: 500; color: #30343B; letter-spacing: -.01em; }
.hp__burger { display: grid; gap: 2.5px; } .hp__burger i { display: block; width: 13px; height: 1.6px; background: #6B7078; border-radius: 1px; }
.hp__baricons { margin-left: auto; display: flex; gap: .9em; color: #3A3F47; } .hp__baricons svg { width: 1.7em; height: 1.7em; }
.hp .is-accent { color: var(--accent); }
.hp__tabs { display: flex; gap: 1.4em; padding: 0 1.2em; white-space: nowrap; overflow: hidden; text-transform: uppercase; font-weight: 500; color: #7A808A; }
.hp__tabs span { padding: .9em 0 .7em; border-bottom: 2px solid transparent; }
.hp__tabs .is-on { border-color: var(--accent); color: #6B7078; }
.hp__search { display: flex; align-items: center; gap: .7em; padding: .9em 1.2em; color: #8B9099; font-size: 1.06em; }
.hp__search svg { width: 1.4em; height: 1.4em; flex: none; }
.hp__rows { flex: 1; overflow: hidden; display: flex; flex-direction: column; }
.hp__rows li { flex: 1; }
.hp__rows li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: .78em 1.2em; background: #F5F8FD; border-bottom: 1.5px solid #fff; }
.hp__rows span { display: grid; min-width: 0; } .hp__rows span:last-child { text-align: right; }
.hp__rows b { font-size: 1.22em; font-weight: 500; color: #30343B; } .hp__rows small { font-size: .88em; color: #8B9099; font-weight: 500; }
.hp .up, .hp .up b, .hp .up small { color: var(--up); } .hp .down, .hp .down b, .hp .down small { color: var(--dn); }
.hp__rows .up b, .hp__rows .down b { font-weight: 700; }
.hp__nav { display: flex; justify-content: space-between; padding: .9em .9em 1em; border-top: 1px solid #ECEFF3; background: #fff; text-transform: uppercase; font-size: .78em; font-weight: 500; color: #7A808A; }
.hp__nav span { position: relative; padding-top: 1.9em; }
.hp__nav span::before { content: ''; position: absolute; top: 0; left: 50%; width: 1.5em; height: 1.5em; transform: translateX(-50%); border-radius: 4px; border: 1.5px solid currentColor; opacity: .7; }
.hp__nav .is-on { color: var(--accent); }

.hp__dash { flex: 1; padding: 1.2em; display: grid; align-content: start; gap: .2em; text-align: center; }
.hp__dashlabel { color: #6B7078; font-size: 1.05em; } .hp__dashlabel--c { margin-top: .9em; }
.hp__dashval { font-size: 1.9em; font-weight: 700; color: #30343B; letter-spacing: -.02em; }
.hp__dashsub { color: #6B7078; margin-bottom: .9em; } .hp__dashsub b { display: block; font-size: 1.15em; }
.hp__dashrow { display: flex; justify-content: space-between; align-items: center; text-align: left; padding: .8em .2em; border-top: 1px solid #ECEFF3; color: #4A4F57; }
.hp__dashrow small { display: block; font-size: .85em; color: #8B9099; } .hp__dashrow b { font-size: 1.12em; color: #30343B; }
.hp__orders { display: grid; grid-template-columns: repeat(3, 1fr); margin: .5em 0 .7em; color: #6B7078; }
.hp__orders b { display: block; font-size: 1.3em; color: #30343B; }

/* floating pieces */
.appx__ticket {
  position: absolute; left: clamp(6px, 2%, 28px); bottom: 12%; width: clamp(150px, 14vw, 200px);
  padding: 12px 14px; border-radius: 4px 20px 4px 20px; background: #fff; border: 1px solid var(--line);
  box-shadow: 0 24px 44px -20px rgba(60, 40, 10, .5); font-size: .78rem;
}
.appx__ticket p { display: grid; gap: 1px; margin-bottom: 9px; } .appx__ticket b { font-size: .88rem; color: var(--text); }
.appx__ticket .up { color: #2E9E4F; font-weight: 700; font-size: 1.02rem; } .appx__ticket small { font-weight: 600; font-size: .72rem; }
.appx__ticket div { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.appx__ticket .buy, .appx__ticket .sell { padding: 7px 0; border-radius: 7px; text-align: center; color: #fff; font-weight: 700; font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; }
.appx__ticket .buy { background: #2E9E4F; } .appx__ticket .sell { background: #D93025; }
.appx__chip {
  position: absolute; right: clamp(8px, 3%, 36px); top: 9%; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px 8px 10px; border-radius: 999px; background: var(--navy); color: #F7F1E2; font-size: .78rem; font-weight: 500;
  border: 1px solid rgba(245, 194, 94, .4); box-shadow: 0 16px 30px -16px rgba(16, 34, 46, .8);
}
.appx__chip .uico { --ia: url(#uAd); --ib: url(#uBd); --ik: #10222E; }

/* feature strip */
.appx__feats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: clamp(28px, 4vw, 52px); border-top: 1px solid var(--line); }
.appx__feats li { display: flex; gap: 14px; align-items: flex-start; padding: 24px clamp(10px, 1.6vw, 26px) 6px; border-left: 1px solid var(--line); min-width: 0; }
.appx__feats li:first-child { border-left: 0; padding-left: 0; }
.appx__fico { display: grid; place-items: center; width: 52px; height: 52px; flex: none; border-radius: 4px 16px 4px 16px; }
.appx__feats h3 { font-size: 1.02rem; margin-bottom: 4px; } .appx__feats p { font-size: .87rem; line-height: 1.5; color: var(--text-soft); }
.appx__note { margin-top: 22px; font-size: .74rem; color: var(--slate); }

@media (max-width: 1100px) {
  .appx { grid-template-columns: 1fr; }
  .appx__stage { min-height: 0; }
  .hp { width: clamp(190px, 30vw, 270px); } .hp__screen { height: clamp(390px, 60vw, 540px); font-size: clamp(.5rem, 1.05vw, .64rem); }
  .appx__feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .appx__feats li:nth-child(odd) { border-left: 0; padding-left: 0; }
}
@media (max-width: 620px) {
  .appx__get { flex-direction: column; align-items: flex-start; border-radius: 6px 24px 6px 24px; }
  .appx__qr { display: none; } /* you are already on the phone — the button is the action */
  .playbtn { justify-self: stretch; justify-content: center; width: 100%; }
  .appx__getbody { width: 100%; }
  .hp--back { display: none; }
  .hp { width: min(250px, 72vw); } .hp__screen { height: min(500px, 140vw); font-size: min(.62rem, 2.5vw); }
  .appx__ticket { left: 4px; bottom: 10%; width: 138px; padding: 9px 10px; }
  .appx__chip { right: 6px; top: 4%; font-size: .7rem; padding: 6px 10px 6px 8px; }
  .appx__feats { grid-template-columns: 1fr; }
  .appx__feats li { border-left: 0; padding: 18px 0 0; }
  .appx__also a { flex: 1 1 100%; border-radius: 16px; }
}
@media (max-width: 420px) {
  .appx__id { flex-wrap: wrap; }
}
@media (max-width: 340px) {
  .appx__ticket { display: none; }
  .appx__id small { font-size: .72rem; }
}


/* ==========================================================================
   Navigation v2 — mega menu, company dropdown, mobile sheet
   Panels stay in the DOM (inert when closed) so they can ease in and out.
   ========================================================================== */
:root { --ease-out: cubic-bezier(.22, 1, .36, 1); --ease-io: cubic-bezier(.65, 0, .35, 1); }

.nav { z-index: 70; }
.navitem { position: relative; }
.navitem--mega { position: static; }
.nav__menu .navlink { padding: 12px 4px; font-size: .96rem; border-radius: 8px; }
.nav__menu .navlink::after { bottom: 5px; left: 4px; right: 4px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--cta-from), var(--cta-to)); transition: transform .35s var(--ease-out); }
.nav__menu .caret { transition: transform .35s var(--ease-out); }
.nav__menu .mm a::after, .nav__menu .dd a::after { display: none; }

/* scrim behind an open panel */
.nav__scrim {
  position: absolute; top: 100%; left: 0; right: 0; height: 100vh; z-index: -1;
  background: rgba(10, 21, 28, .34); backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden; transition: opacity .35s ease, visibility 0s linear .35s;
}
.nav.has-open .nav__scrim { opacity: 1; visibility: visible; transition: opacity .35s ease, visibility 0s; }

/* ---------- shared panel motion ---------- */
.mm, .dd {
  position: absolute; z-index: 2; top: calc(100% + 1px);
  visibility: hidden; opacity: 0; pointer-events: none;
  transform: translateY(-10px); clip-path: inset(0 0 22% 0 round 6px 34px 6px 34px);
  transition: opacity .26s ease, transform .42s var(--ease-out), clip-path .46s var(--ease-out), visibility 0s linear .46s;
}
.mm[data-open], .dd[data-open] {
  visibility: visible; opacity: 1; pointer-events: auto; transform: none;
  clip-path: inset(-60px -60px -90px -60px round 6px 34px 6px 34px);
  transition: opacity .26s ease, transform .42s var(--ease-out), clip-path .46s var(--ease-out), visibility 0s;
}
.mm .mitem, .dd .mitem, .mm__rail > *, .mm__preview, .mm__foot { opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .5s var(--ease-out), background-color .2s ease; }
.mm[data-open] .mitem, .dd[data-open] .mitem, .mm[data-open] .mm__rail > *, .mm[data-open] .mm__preview, .mm[data-open] .mm__foot {
  opacity: 1; transform: none; transition-delay: calc(70ms + var(--i, 0) * 28ms), calc(70ms + var(--i, 0) * 28ms), 0s;
}
.mm[data-open] .mm__rail > :nth-child(2) { --i: 1; } .mm[data-open] .mm__rail > :nth-child(3) { --i: 2; }
.mm[data-open] .mm__rail > :nth-child(4) { --i: 3; } .mm[data-open] .mm__rail > :nth-child(5) { --i: 4; }
.mm[data-open] .mm__rail > :nth-child(6) { --i: 5; } .mm[data-open] .mm__rail > :nth-child(7) { --i: 6; }
.mm[data-open] .mm__preview { --i: 5; } .mm[data-open] .mm__foot { --i: 8; }

/* ---------- mega panel ---------- */
.mm {
  left: var(--gutter); right: var(--gutter);
  border-radius: 6px 34px 6px 34px; background: var(--surface);
  border: 1px solid rgba(176, 122, 35, .22);
  box-shadow: 0 50px 90px -40px rgba(10, 21, 28, .55), 0 2px 0 rgba(255, 255, 255, .6) inset;
  overflow: hidden;
}
.mm__inner { display: grid; grid-template-columns: minmax(250px, .82fr) minmax(0, 2fr) minmax(260px, .9fr); gap: clamp(14px, 1.6vw, 28px); padding: 14px; }

.mm__rail {
  position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  padding: clamp(22px, 2vw, 30px); border-radius: 4px 26px 4px 26px;
  background: linear-gradient(155deg, #1B3344 0%, #10222E 50%, #070F15 100%);
  border: 1px solid rgba(245, 194, 94, .26); color: var(--text-on-dark);
}
.mm__blades {
  position: absolute; z-index: -1; right: -26%; bottom: -16%; width: 96%; aspect-ratio: 1; opacity: .08; transform: none !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23F5C25E' d='M38 5C20 25 28 45 50 60c16 11 20 22 12 37 22-17 22-39 0-55C44 29 34 20 38 5ZM18 45C8 58 14 70 28 79c10 7 12 13 9 21 13-12 11-24-1-33-12-9-19-14-18-22Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.mm[data-open] .mm__blades { opacity: .08 !important; }
.mm__kicker { font-size: .68rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.mm__title { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.45rem, 1.9vw, 1.9rem); line-height: 1.06; letter-spacing: -.035em; color: #fff; }
.mm__title em { font-family: var(--font-display); font-style: normal; font-weight: 800; letter-spacing: inherit; background: linear-gradient(120deg, #FFE9B0, #E6B552); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .08em; }
.mm__copy { font-size: .88rem; line-height: 1.55; color: rgba(247, 241, 226, .76); }
.nav__menu .mm__rail .btn { padding: 13px 20px; font-size: .92rem; font-weight: 600; color: #FFF8EA; margin-top: 4px; }
.nav__menu .mm__all { padding: 0; font-size: .88rem; font-weight: 600; color: var(--gold); }
.mm__all span { display: inline-block; transition: transform .3s var(--ease-out); } .mm__all:hover span { transform: translateX(4px); }
.nav__menu .mm__desk { display: flex; align-items: center; gap: 12px; width: 100%; margin-top: auto; padding: 14px 0 0; border-top: 1px solid rgba(247, 241, 226, .14); border-radius: 0; }
.mm__desk small { display: block; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(247, 241, 226, .6); font-weight: 500; }
.mm__desk strong { display: block; font-size: 1.02rem; color: #fff; font-weight: 700; }
.mm__desk:hover strong { color: var(--gold); }

.mm__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px clamp(10px, 1.4vw, 26px); align-content: start; padding: 10px 0 4px; }
.mm__col { display: grid; gap: 14px; align-content: start; }
.mm__gtitle { display: flex; align-items: center; gap: 10px; margin: 0 0 4px 12px; font-size: .68rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--bronze); }
.mm__gtitle::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }

/* one row — used by mega, dropdown and the mobile sheet */
.nav .mitem {
  position: relative; display: flex; align-items: center; gap: 14px; width: 100%;
  padding: 9px 12px; border-radius: 4px 18px 4px 18px; color: var(--text); font-size: 1rem;
}
.nav .mitem::before { content: ''; position: absolute; left: 0; top: 22%; bottom: 22%; width: 2.5px; border-radius: 2px; background: linear-gradient(180deg, var(--cta-from), var(--cta-to)); transform: scaleY(0); transition: transform .35s var(--ease-out); }
.mitem__ico { display: grid; place-items: center; flex: none; width: 50px; height: 50px; border-radius: 4px 16px 4px 16px; }
.mitem__ico > .uico { width: 60%; height: 60%; }
.mitem__txt { min-width: 0; flex: 1; }
.mitem__txt strong { display: block; font-size: .97rem; font-weight: 600; letter-spacing: -.012em; line-height: 1.25; }
.mitem__txt small { display: block; font-size: .8rem; font-weight: 400; color: var(--text-soft); line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mitem__go { flex: none; width: 18px; height: 18px; color: var(--gold-deep); opacity: 0; transform: translateX(-8px); transition: opacity .25s ease, transform .4s var(--ease-out); }
.nav .mitem:hover, .nav .mitem:focus-visible, .nav .mitem.is-hot { background: color-mix(in srgb, var(--gold) 13%, var(--surface)); }
.nav .mitem:hover::before, .nav .mitem:focus-visible::before, .nav .mitem.is-hot::before, .nav .mitem[aria-current="page"]::before { transform: none; }
.nav .mitem:hover .mitem__go, .nav .mitem:focus-visible .mitem__go, .nav .mitem.is-hot .mitem__go { opacity: 1; transform: none; }
.nav .mitem:hover .mitem__ico, .nav .mitem.is-hot .mitem__ico { transform: translateY(-1px) rotate(-3deg); }
.nav .mitem[aria-current="page"] strong { color: var(--gold-deep); }

/* preview pane — follows the hovered service */
.mm__preview { position: relative; min-height: 320px; border-radius: 4px 26px 4px 26px; background: linear-gradient(160deg, #FFFEFA, #F8EFD9 70%, #F1E2BF); border: 1px solid rgba(176, 122, 35, .2); overflow: hidden; }
.mprev { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: clamp(20px, 1.8vw, 28px); opacity: 0; transform: translateY(10px) scale(.985); transition: opacity .28s ease, transform .5s var(--ease-out); pointer-events: none; }
.mprev.is-on { opacity: 1; transform: none; transition-delay: .06s; }
.mprev__ico { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 6px 26px 6px 26px; margin-bottom: 8px; }
.mprev__ico > .uico { width: 62%; height: 62%; }
.mprev__name { font-family: var(--font-display); font-weight: 800; font-size: 1.4rem; letter-spacing: -.03em; line-height: 1.1; }
.mprev__short { font-size: .88rem; line-height: 1.5; color: var(--text-soft); }
.mprev ul { display: grid; gap: 6px; margin-top: 6px; }
.mprev li { position: relative; padding-left: 20px; font-size: .84rem; font-weight: 500; color: var(--text); }
.mprev li::before { content: ''; position: absolute; left: 0; top: .28em; width: 9px; height: 12px; background: linear-gradient(160deg, var(--cta-from), var(--cta-to)); border-radius: 1px 7px 1px 7px; }
.mprev__more { margin-top: auto; font-size: .86rem; font-weight: 600; color: var(--gold-deep); }

.mm__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 24px; padding: 12px clamp(18px, 2vw, 28px); border-top: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 70%, var(--surface)); font-size: .82rem; }
.mm__foot p { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; color: var(--text-soft); }
.mm__foot span { font-weight: 600; color: var(--text); }
.nav__menu .mm__foot a { padding: 2px 0; font-size: .82rem; font-weight: 500; color: var(--gold-deep); }
.nav__menu .mm__foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.mm__reg { font-size: .72rem !important; color: var(--slate) !important; letter-spacing: .02em; }

/* ---------- company dropdown ---------- */
.dd { left: 50%; width: min(620px, 80vw); margin-left: max(-310px, -40vw); padding: 12px; border-radius: 6px 30px 6px 30px; background: var(--surface); border: 1px solid rgba(176, 122, 35, .22); box-shadow: 0 40px 70px -36px rgba(10, 21, 28, .5); }
.dd ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }

@media (max-width: 1400px) { .mm__inner { grid-template-columns: minmax(240px, .8fr) minmax(0, 2fr); } .mm__preview { display: none; } }

/* ---------- burger ---------- */
.nav__burger { position: relative; width: 46px; height: 46px; padding: 0; border-radius: 4px 15px 4px 15px; border: 1px solid var(--line); background: var(--surface); align-items: center; justify-content: center; gap: 0; transition: background .25s ease, border-color .25s ease; }
.nav__burger span { position: absolute; left: 13px; width: 20px; height: 2px; border-radius: 2px; background: var(--text); transition: transform .45s var(--ease-out), opacity .2s ease, width .45s var(--ease-out), background .25s ease; }
.nav__burger span:nth-child(1) { top: 16px; } .nav__burger span:nth-child(2) { top: 22px; width: 14px; } .nav__burger span:nth-child(3) { top: 28px; }
.nav__burger[aria-expanded="true"] { background: var(--navy); border-color: var(--navy); }
.nav__burger[aria-expanded="true"] span { background: var(--gold); }
.nav__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: translateX(8px); }
.nav__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- mobile / tablet sheet ---------- */
.mnav { display: none; }
@media (max-width: 1180px) {
  .mnav {
    position: absolute; top: 100%; left: 0; right: 0; height: calc(100dvh - var(--mnav-top, 72px));
    display: flex; flex-direction: column; background: var(--bg-warm);
    visibility: hidden; clip-path: inset(0 0 100% 0); opacity: .6;
    transition: clip-path .55s var(--ease-io), opacity .35s ease, visibility 0s linear .55s;
  }
  .mnav[data-open] { visibility: visible; clip-path: inset(0); opacity: 1; transition: clip-path .6s var(--ease-out), opacity .3s ease, visibility 0s; }
  .mnav__scroll { position: relative; isolation: isolate; flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 10px var(--gutter) 28px; -webkit-overflow-scrolling: touch; }
  .mnav__blades { position: fixed; z-index: -1; right: -18%; bottom: 8%; width: min(90vw, 520px); aspect-ratio: 1; opacity: .06; pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath fill='%23B07A23' d='M38 5C20 25 28 45 50 60c16 11 20 22 12 37 22-17 22-39 0-55C44 29 34 20 38 5ZM18 45C8 58 14 70 28 79c10 7 12 13 9 21 13-12 11-24-1-33-12-9-19-14-18-22Z'/%3E%3C/svg%3E") center / contain no-repeat; }

  /* rows arrive one after another */
  .mnav__scroll > * { opacity: 0; transform: translateY(14px); transition: opacity .3s ease, transform .55s var(--ease-out); }
  .mnav[data-open] .mnav__scroll > * { opacity: 1; transform: none; transition-delay: calc(140ms + var(--i, 0) * 55ms); }
  .mnav[data-open] .mnav__blades { opacity: .06; }

  .macc { border-bottom: 1px solid var(--line); }
  .macc h2 { margin: 0; font: inherit; letter-spacing: 0; }
  .macc__head, .mnav__link {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
    padding: 18px 2px; background: none; border: 0; cursor: pointer; text-align: left; color: var(--text);
    font-family: var(--font-display); font-size: clamp(1.25rem, 4.6vw, 1.55rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.1;
  }
  .mnav__link { border-bottom: 1px solid var(--line); }
  .mnav__link small { display: block; margin-top: 3px; font-family: var(--font-body); font-size: .8rem; font-weight: 400; letter-spacing: 0; color: var(--text-soft); }
  .mnav__link svg { flex: none; width: 20px; height: 20px; color: var(--gold-deep); transition: transform .35s var(--ease-out); }
  .mnav__link:active svg { transform: translateX(4px); }
  .mnav__link[aria-current="page"], .macc__head[aria-expanded="true"] { color: var(--gold-deep); }
  .macc__chev { position: relative; flex: none; width: 34px; height: 34px; border-radius: 4px 12px 4px 12px; border: 1px solid var(--line); background: var(--surface); transition: background .3s ease, border-color .3s ease, transform .45s var(--ease-out); }
  .macc__chev::before, .macc__chev::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; border-radius: 2px; background: var(--text); transition: transform .45s var(--ease-out), background .3s ease; }
  .macc__chev::after { transform: rotate(90deg); }
  .macc__head[aria-expanded="true"] .macc__chev { background: var(--navy); border-color: var(--navy); transform: rotate(180deg); }
  .macc__head[aria-expanded="true"] .macc__chev::before, .macc__head[aria-expanded="true"] .macc__chev::after { background: var(--gold); }
  .macc__head[aria-expanded="true"] .macc__chev::after { transform: rotate(0deg); }

  .macc__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .55s var(--ease-out); }
  .macc.is-open .macc__body { grid-template-rows: 1fr; }
  .macc__inner { min-height: 0; overflow: hidden; visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility 0s linear .5s; }
  .macc.is-open .macc__inner { visibility: visible; opacity: 1; padding-bottom: 16px; transition: opacity .4s ease .12s, visibility 0s; }
  .mnav__group { margin-top: 12px; } .mnav__group:first-child { margin-top: 2px; }
  .mnav__group ul, .macc__inner > ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; }
  .mnav .mitem { padding: 9px 8px; } .mnav .mitem__go { opacity: .55; transform: none; }
  .mnav .mm__gtitle { margin-left: 8px; }
  .mnav__all { display: inline-flex; gap: 8px; margin: 14px 0 0 8px; font-size: .9rem; font-weight: 600; color: var(--gold-deep); }

  .mnav__desk { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 22px; border-radius: 6px 26px 6px 26px; overflow: hidden; background: linear-gradient(155deg, #1B3344, #10222E 55%, #070F15); border: 1px solid rgba(245, 194, 94, .28); }
  .mnav__desk a { display: flex; align-items: center; gap: 12px; padding: 16px; min-width: 0; color: var(--text-on-dark); }
  .mnav__desk a + a { border-left: 1px solid rgba(247, 241, 226, .12); }
  .mnav__desk span { min-width: 0; } .mnav__desk small { display: block; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(247, 241, 226, .6); }
  .mnav__desk strong { display: block; font-size: .95rem; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mnav__quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
  .mnav__quick a { display: block; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); font-size: .84rem; font-weight: 500; }
  .mnav__reg { margin-top: 16px; font-size: .68rem; color: var(--slate); }

  .mnav__cta { flex: none; display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(12px); border-top: 1px solid var(--line); box-shadow: 0 -14px 30px -22px rgba(16, 34, 46, .45); transform: translateY(100%); transition: transform .55s var(--ease-out) .1s; }
  .mnav[data-open] .mnav__cta { transform: none; transition-delay: .28s; }
  .mnav__cta .btn { padding: 15px 22px; }
  html.menu-open .stickycta { transform: translateY(110%); }
  .stickycta { transition: transform .4s var(--ease-out); }
}
@media (max-width: 620px) {
  .mnav__group ul, .macc__inner > ul { grid-template-columns: 1fr; }
  .mnav__desk { grid-template-columns: 1fr; } .mnav__desk a + a { border-left: 0; border-top: 1px solid rgba(247, 241, 226, .12); }
}
@media (max-width: 340px) {
  .mitem__ico { width: 42px; height: 42px; } .mnav .mitem { gap: 10px; }
  .mnav__cta { grid-template-columns: 1fr; } .mnav__cta .btn--ghost { display: none; }
  .nav__burger { width: 40px; height: 40px; } .nav__burger span { left: 10px; } .nav__burger span:nth-child(1) { top: 13px; } .nav__burger span:nth-child(2) { top: 19px; } .nav__burger span:nth-child(3) { top: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  .mm, .dd, .mnav, .mnav__scroll > *, .mm .mitem, .mm__rail > *, .mprev, .macc__body, .mnav__cta { transition-duration: .01ms !important; transition-delay: 0s !important; }
}
.nav__menu .mm ul, .nav__menu .mm__preview ul { display: grid; gap: 2px; align-items: stretch; }
.nav__menu .mm__preview ul { gap: 6px; }
.nav__menu .dd ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; align-items: stretch; }
.mitem__ico { transition: transform .45s var(--ease-out), background .25s ease, border-color .25s ease, box-shadow .25s ease; }
.nav__menu .mm__rail .btn--gold { background: linear-gradient(135deg, var(--cta-from), var(--cta-to)); box-shadow: var(--shadow-btn); justify-content: center; }
.nav__menu .mm__rail .btn--gold:hover { transform: translateY(-2px); }
.dd .mitem__txt small { white-space: normal; }
.dd--wide { width: min(700px, 86vw); margin-left: max(-420px, -52vw); }


/* ==========================================================================
   Page hero with photograph. The image sits on the right and dissolves into the
   page from the left, so the copy always reads on clean ivory.
   ========================================================================== */
.phero--img { background: var(--bg-warm); }
.phero--img .phero__inner { grid-template-columns: minmax(0, 1fr); min-height: clamp(380px, 34vw, 560px); }
.phero--img .phero__copy { max-width: min(760px, 56%); }
.phero__media { position: absolute; inset: 0 0 0 40%; z-index: 0; }
.phero__media img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .18) 16%, rgba(0, 0, 0, .7) 40%, #000 62%);
          mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .18) 16%, rgba(0, 0, 0, .7) 40%, #000 62%);
  filter: saturate(.92) contrast(1.02);
}
/* warm wash ties any photo to the palette; bottom fade seats it on the next band */
.phero__media::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, var(--bg-warm) 0%, color-mix(in srgb, var(--bg-warm) 40%, transparent) 30%, transparent 58%),
    linear-gradient(180deg, transparent 72%, color-mix(in srgb, var(--bg-warm) 70%, transparent) 100%),
    linear-gradient(135deg, rgba(245, 194, 94, .16), rgba(16, 34, 46, .1));
}
.phero--img .phero__arc { opacity: .16; }
@media (max-width: 1024px) {
  .phero--img .phero__copy { max-width: 100%; }
  .phero--img .phero__inner { min-height: 0; }
  .phero__media { inset: 0; opacity: .3; }
  .phero__media img { -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 55%); mask-image: linear-gradient(180deg, transparent 0%, #000 55%); object-position: center bottom !important; }
  .phero__media::after { background: linear-gradient(180deg, var(--bg-warm) 0%, color-mix(in srgb, var(--bg-warm) 55%, transparent) 60%, color-mix(in srgb, var(--bg-warm) 30%, transparent) 100%); }
}