/* ==========================================================================
   Arth - service pages (Branding first; one template for every service).
   Body classes: arth-home4 (Home 4 header + menu) arth-sp arth-sp--<slug>.
   Sections: .sp-hero  .sp-scope  .sp-gallery  .sp-clients  .sp-cta
   Montserrat only. Behaviour: arth-sp.js (header state, mobile scope accordion).
   ========================================================================== */
body.arth-sp {
  --sp-navy: #021C42; --sp-teal: #152F41; --sp-ivory: #F5F4EB; --sp-surface: #EDE9E2;
  --sp-berry: #A6445D; --sp-ochre: #D89B65;
  --sp-ink-80: rgba(2, 28, 66, .8); --sp-ink-60: rgba(2, 28, 66, .62);
  --sp-line: rgba(2, 28, 66, .14);
  --sp-sans: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --sp-gutter: clamp(20px, 4.4vw, 72px); /* matches the Home 4 header gutter */
  --sp-max: 1320px;
  --sp-pad: clamp(64px, 8vw, 120px);
  --sp-ease: cubic-bezier(.22, .8, .2, 1);
  background: var(--sp-ivory); color: var(--sp-navy); font-family: var(--sp-sans);
  overflow-x: clip;
}
body.arth-sp .elementor, body.arth-sp .sp { max-width: 100vw; }
body.arth-sp .sp img { max-width: 100%; }

/* Elementor resets inside the service sections */
body.arth-sp .e-con.sp {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px; --min-height: 0; --width: 100%;
}
body.arth-sp .sp .e-con { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px; --min-height: 0; }
body.arth-sp .sp .elementor-widget { margin: 0 !important; }
body.arth-sp .sp .elementor-widget-container { margin: 0; padding: 0; }
body.arth-sp .sp p { margin: 0; }
body.arth-sp .sp .elementor-heading-title { font-family: var(--sp-sans); color: inherit; margin: 0; text-wrap: balance; }
body.arth-sp .sp p { text-wrap: pretty; }
body.arth-sp .sp-wrap { width: 100%; max-width: var(--sp-max); margin-inline: auto; box-sizing: border-box; }

/* shared section heading */
body.arth-sp .sp-h2 .elementor-heading-title {
  font: 500 clamp(1.35rem, 2.3vw, 2rem)/1.1 var(--sp-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--sp-navy);
}

/* shared pill buttons */
body.arth-sp .sp-btn .elementor-button {
  display: inline-flex; align-items: center; gap: .7em;
  font: 500 .72rem/1 var(--sp-sans); letter-spacing: .15em; text-transform: uppercase;
  padding: 1.15em 1.8em; border-radius: 999px; border: 1px solid var(--sp-navy);
  background: transparent; color: var(--sp-navy); box-shadow: none; text-decoration: none;
  transition: background-color .35s var(--sp-ease), color .35s var(--sp-ease), border-color .35s var(--sp-ease), transform .2s;
}
body.arth-sp .sp-btn .elementor-button:hover { background: var(--sp-navy); color: var(--sp-ivory); }
body.arth-sp .sp-btn .elementor-button:active { transform: translateY(1px) scale(.99); }
body.arth-sp .sp-btn .elementor-button:focus-visible { outline: 2px solid var(--sp-ochre); outline-offset: 3px; }
body.arth-sp .sp-btn--light .elementor-button { background: var(--sp-ivory); color: var(--sp-navy); border-color: var(--sp-ivory); }
body.arth-sp .sp-btn--light .elementor-button:hover { background: var(--sp-berry); color: #fff; border-color: var(--sp-berry); }

/* ------------------------------------------------------------------ 1. hero */
body.arth-sp .e-con.sp-hero {
  position: relative; overflow: hidden; height: 40vh; min-height: 300px; max-height: 560px;
  display: flex; align-items: center; justify-content: center; background: var(--sp-navy);
}
/* desktop only: a taller hero (tablet and phone keep 40vh) */
@media (min-width: 1025px) {
  body.arth-sp .e-con.sp-hero { height: 50vh; max-height: 720px; }
}
body.arth-sp .sp-hero-bg { position: absolute !important; inset: 0; width: 100% !important; height: 100%; z-index: 0; }
body.arth-sp .sp-hero-bg, body.arth-sp .sp-hero-bg > *, body.arth-sp .sp-hero-bg img { height: 100% !important; width: 100% !important; max-width: none !important; }
body.arth-sp .sp-hero-bg img { object-fit: cover; object-position: center 45%; display: block; }
body.arth-sp .sp-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(2,28,66,.62) 0%, rgba(2,28,66,.38) 45%, rgba(2,28,66,.66) 100%);
}
body.arth-sp .e-con.sp-hero-inner {
  position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 56px var(--sp-gutter) 0 !important; width: 100%;
}
body.arth-sp .sp-hero-word { width: clamp(260px, 36vw, 540px) !important; max-width: 84vw; }
/* visually hidden, still read by search engines and screen readers (e.g. the H1 when the wordmark says it) */
body.arth-sp .sp-sr { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; margin: -1px !important; }
body.arth-sp .sp-hero-word img { display: block; width: 100%; height: auto; }
body.arth-sp .sp-hero-sub .elementor-heading-title {
  margin-top: clamp(10px, 1.4vw, 18px); font: 500 .74rem/1.4 var(--sp-sans); letter-spacing: .32em; text-transform: uppercase; color: rgba(255,255,255,.88);
}

/* ----------------------------------------------------------------- 2. scope */
body.arth-sp .e-con.sp-scope { padding: var(--sp-pad) var(--sp-gutter) !important; background: var(--sp-ivory); }
body.arth-sp .e-con.sp-scope-head { display: flex; flex-direction: column; gap: 14px; margin-bottom: clamp(36px, 5vw, 64px); }
body.arth-sp .sp-scope-intro, body.arth-sp .sp-scope-intro p { font: 400 clamp(.98rem, 1.1vw, 1.08rem)/1.65 var(--sp-sans); color: var(--sp-ink-80); max-width: 54ch; }
/* genre tags under the scope intro (information only, not interactive) */
body.arth-sp .sp-genres { margin-top: 10px !important; }
body.arth-sp .sp-genres p { font: 600 .7rem/1.4 var(--sp-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sp-ink-60); margin: 0 0 12px; }
body.arth-sp .sp-genres ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
body.arth-sp .sp-genres li {
  list-style: none; margin: 0; padding: .75em 1.35em; border: 1px solid rgba(2, 28, 66, .35); border-radius: 999px;
  font: 500 .7rem/1 var(--sp-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sp-navy); white-space: nowrap;
}
body.arth-sp .sp-genres li::marker { content: none; }
body.arth-sp .e-con.sp-scope-grid {
  display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(32px, 4vw, 64px); row-gap: 0;
}
body.arth-sp .e-con.sp-item {
  position: relative; display: flex; flex-direction: column; gap: 0;
  padding: 28px 0 clamp(36px, 4vw, 52px) !important; border-top: 1px solid var(--sp-line);
}
body.arth-sp .sp-item::before {
  content: ""; position: absolute; left: 0; top: -1px; width: 100%; height: 1px; background: var(--sp-navy);
  transform: scaleX(0); transform-origin: left; transition: transform .6s var(--sp-ease);
}
body.arth-sp .sp-item:hover::before { transform: scaleX(1); }
body.arth-sp .sp-item-num .elementor-heading-title { font: 600 .72rem/1 var(--sp-sans); letter-spacing: .16em; color: var(--sp-ochre); }
body.arth-sp .sp-item-title .elementor-heading-title {
  margin-top: 14px; font: 600 clamp(.92rem, 1vw, 1rem)/1.35 var(--sp-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--sp-navy);
}
body.arth-sp .sp-item-desc { margin-top: 14px !important; }
body.arth-sp .sp-item-desc p { font: 400 .95rem/1.65 var(--sp-sans); color: var(--sp-ink-80); max-width: 40ch; }
body.arth-sp .sp-item-desc p + p { margin-top: 10px; }
body.arth-sp .sp-item-desc .sp-deliv { font-size: .84rem; line-height: 1.6; color: var(--sp-ink-60); }

/* -------------------------------- 2b. tabbed scope (Event Management) */
/* sticky tab bar: stays in view while a category's services are read */
body.arth-sp .e-con.sp-tabbar {
  position: sticky; top: var(--sp-stick, 0px); z-index: 30; background: var(--sp-ivory);
  margin: 0 calc(var(--sp-gutter) * -1) clamp(28px, 4vw, 48px) !important; padding: 12px var(--sp-gutter) !important;
  width: calc(100% + var(--sp-gutter) * 2) !important; max-width: none; box-sizing: border-box;
  transition: top .35s var(--sp-ease), box-shadow .3s;
}
body.arth-sp .sp-tabbar.is-stuck { box-shadow: 0 1px 0 var(--sp-line); }
body.arth-sp .e-con.sp-tabs {
  display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px !important;
  width: 100%; max-width: 780px; margin: 0 auto; box-sizing: border-box;
  border: 1px solid rgba(2, 28, 66, .28); border-radius: 999px; counter-reset: sp-tab;
}
body.arth-sp .sp-tab, body.arth-sp .sp-tab .elementor-button-wrapper { width: 100%; height: 100%; }
body.arth-sp .sp-tab .elementor-button {
  width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  padding: 14px 12px; border: 0; border-radius: 999px; background: transparent; color: var(--sp-navy); box-shadow: none;
  font: 600 .74rem/1.2 var(--sp-sans); letter-spacing: .12em; text-transform: uppercase; text-align: center; white-space: normal;
  text-decoration: none; transition: background-color .3s var(--sp-ease), color .3s var(--sp-ease);
}
body.arth-sp .sp-tab .elementor-button::before {
  counter-increment: sp-tab; content: "0" counter(sp-tab); font: 600 .6rem/1 var(--sp-sans); letter-spacing: .16em; color: var(--sp-ochre);
}
body.arth-sp .sp-tab .elementor-button:hover { background: rgba(2, 28, 66, .06); color: var(--sp-navy); }
body.arth-sp .sp-tab.is-active .elementor-button, body.arth-sp .sp-tab.is-active .elementor-button:hover { background: var(--sp-navy); color: var(--sp-ivory); }
body.arth-sp .sp-tab .elementor-button:focus-visible { outline: 2px solid var(--sp-ochre); outline-offset: 2px; }

/* panels: all visible without JS; one at a time once the tabs are ready */
body.arth-sp .e-con.sp-panel { display: flex; flex-direction: column; }
body.arth-sp .e-con.sp-panel + .e-con.sp-panel { margin-top: var(--sp-pad); }
body.arth-sp .sp-panel-title .elementor-heading-title { font: 600 1rem/1.3 var(--sp-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--sp-navy); margin-bottom: 18px; }
body.arth-sp .sp-tabs-ready .e-con.sp-panel:not(.is-active) { display: none !important; }
body.arth-sp .sp-tabs-ready .e-con.sp-panel + .e-con.sp-panel { margin-top: 0; }
body.arth-sp .sp-tabs-ready .sp-panel-title { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.arth-sp:not(.sp-tabs-on) .e-con.sp-tabbar { display: none !important; }
body.arth-sp.elementor-editor-active .e-con.sp-tabbar { display: flex !important; position: relative; }
body.arth-sp .sp-tabs-ready .e-con.sp-panel.is-active { animation: sp-fade .45s var(--sp-ease); }
@keyframes sp-fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* clients line + photos inside each panel */
body.arth-sp .sp-worked { margin-top: clamp(28px, 3.4vw, 44px) !important; }
/* "Worked with" logo strip inside each panel */
body.arth-sp .e-con.sp-plogos-wrap {
  display: flex; flex-direction: column; gap: 18px; margin-top: clamp(28px, 3.4vw, 44px);
  padding-top: clamp(22px, 2.6vw, 30px) !important; border-top: 1px solid var(--sp-line);
}
body.arth-sp .sp-plabel .elementor-heading-title { font: 600 .7rem/1.4 var(--sp-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sp-ink-60); }
body.arth-sp .e-con.sp-plogos { display: flex !important; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 22px clamp(28px, 4vw, 56px); }
body.arth-sp .sp-plogo { flex: 0 0 auto; width: auto !important; height: clamp(44px, 4.4vw, 58px); display: flex; align-items: center; }
body.arth-sp .sp-plogo > *, body.arth-sp .sp-plogo a { height: 100%; display: flex; align-items: center; }
body.arth-sp .sp-plogo img { max-height: 100%; max-width: 170px; width: auto; height: auto; object-fit: contain; opacity: .9; transition: opacity .3s; }
body.arth-sp .sp-plogo:hover img { opacity: 1; }
body.arth-sp .e-con.sp-pg { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: clamp(24px, 3vw, 36px); }
body.arth-sp .sp-pg-item { overflow: hidden; aspect-ratio: 4 / 5; background: var(--sp-surface); min-width: 0; }
body.arth-sp .sp-pg-item > *, body.arth-sp .sp-pg-item img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; }
body.arth-sp .sp-pg-item img { object-fit: cover; transition: transform 1.1s var(--sp-ease); }
body.arth-sp .sp-pg-item:hover img { transform: scale(1.035); }
body.arth-sp .sp-next-wrap { display: flex; justify-content: center; margin-top: clamp(28px, 3.4vw, 44px); }
body.arth-sp .sp-next {
  background: none; border: 0; border-bottom: 1px solid currentColor; padding: 6px 0; cursor: pointer; color: var(--sp-navy);
  font: 600 .7rem/1 var(--sp-sans); letter-spacing: .16em; text-transform: uppercase; transition: color .3s;
}
body.arth-sp .sp-next:hover { color: var(--sp-berry); }
body.arth-sp .sp-next:focus-visible { outline: 2px solid var(--sp-ochre); outline-offset: 3px; }
@media (max-width: 767px) {
  body.arth-sp .e-con.sp-tabbar { padding: 10px var(--sp-gutter) !important; }
  body.arth-sp .e-con.sp-tabs { border-radius: 18px; }
  body.arth-sp .e-con.sp-tabs { gap: 2px; padding: 3px !important; }
  body.arth-sp .sp-tab .elementor-button { border-radius: 14px; padding: 10px 2px; font-size: min(.64rem, 2.6vw); letter-spacing: .05em; white-space: nowrap; min-height: 52px; }
  body.arth-sp .e-con.sp-plogos { gap: 18px 20px; }
  body.arth-sp .sp-plogo { height: 42px; }
  body.arth-sp .sp-plogo img { max-width: 120px; }
  body.arth-sp .e-con.sp-pg { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
}
@media (prefers-reduced-motion: reduce) { body.arth-sp .sp-tabs-ready .e-con.sp-panel.is-active { animation: none; } }

/* --------------------------------------------------------------- 3. gallery */
body.arth-sp .e-con.sp-gallery { padding: 0 0 var(--sp-pad) !important; background: var(--sp-ivory); }
/* when the gallery follows a banded section (e.g. clients on Marketing) it needs its own top spacing */
body.arth-sp .sp-clients + .e-con.sp-gallery, body.arth-sp .sp-feed + .e-con.sp-gallery { padding-top: var(--sp-pad) !important; }
body.arth-sp .e-con.sp-gallery-head {
  display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 0 var(--sp-gutter) !important; margin-bottom: clamp(24px, 3vw, 40px);
}
body.arth-sp .sp-gallery-head > .elementor-widget { width: auto; }
body.arth-sp .e-con.sp-gal {
  display: grid !important; grid-template-columns: 1.55fr 1fr 1fr 1fr; grid-template-rows: repeat(2, clamp(200px, 19vw, 330px));
  gap: 8px; padding: 0 var(--sp-gutter) !important;
}
body.arth-sp .sp-gal-item { overflow: hidden; background: var(--sp-surface); min-width: 0; }
body.arth-sp .sp-gal-item--lead { grid-row: 1 / 3; }
body.arth-sp .sp-gal-item, body.arth-sp .sp-gal-item > *, body.arth-sp .sp-gal-item img { width: 100% !important; height: 100% !important; max-width: none !important; }
body.arth-sp .sp-gal-item img { display: block; object-fit: cover; transition: transform 1.1s var(--sp-ease); }
body.arth-sp .sp-gal-item:hover img { transform: scale(1.035); }

/* ------------------------------------------- 3b. on the feed (Marketing) */
body.arth-sp .e-con.sp-feed { padding: 0 var(--sp-gutter) var(--sp-pad) !important; background: var(--sp-ivory); min-width: 0; }
body.arth-sp .e-con.sp-feed-head { display: flex; flex-direction: column; gap: 12px; margin-bottom: clamp(24px, 3vw, 40px); }
body.arth-sp .sp-feed-intro p { font: 400 clamp(.95rem, 1.05vw, 1.05rem)/1.65 var(--sp-sans); color: var(--sp-ink-80); max-width: 52ch; }
body.arth-sp .e-con.sp-feed-cards {
  display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 28px); min-width: 0; max-width: 100%;
}
body.arth-sp .e-con.sp-feed-card { display: flex; flex-direction: column; background: var(--sp-surface); min-width: 0; }
body.arth-sp .sp-feed-grid { width: 100% !important; aspect-ratio: 1 / 1; overflow: hidden; background: var(--sp-navy); }
body.arth-sp .sp-feed-grid > *, body.arth-sp .sp-feed-grid a, body.arth-sp .sp-feed-grid img { display: block; width: 100% !important; height: 100% !important; max-width: none !important; }
body.arth-sp .sp-feed-grid img { object-fit: cover; transition: transform 1.1s var(--sp-ease); }
body.arth-sp .sp-feed-card:hover .sp-feed-grid img { transform: scale(1.03); }
body.arth-sp .e-con.sp-feed-meta {
  display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 18px !important;
}
body.arth-sp .e-con.sp-feed-id { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
body.arth-sp .sp-feed-handle .elementor-heading-title { font: 600 .9rem/1.2 var(--sp-sans); letter-spacing: .01em; color: var(--sp-navy); }
body.arth-sp .sp-feed-handle .elementor-heading-title, body.arth-sp .sp-feed-name .elementor-heading-title { overflow-wrap: anywhere; }
body.arth-sp .sp-feed-handle a { color: inherit; text-decoration: none; }
body.arth-sp .sp-feed-name .elementor-heading-title { font: 400 .78rem/1.3 var(--sp-sans); color: var(--sp-ink-60); }
body.arth-sp .sp-feed-link { flex: 0 0 auto; width: auto; }
body.arth-sp .sp-feed-link .elementor-button {
  background: none; border: 0; padding: 6px 0; box-shadow: none; border-radius: 0;
  font: 600 .66rem/1 var(--sp-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--sp-navy);
  border-bottom: 1px solid currentColor; transition: color .3s;
}
body.arth-sp .sp-feed-link .elementor-button:hover { color: var(--sp-berry); background: none; }
body.arth-sp .sp-feed-link .elementor-button:focus-visible { outline: 2px solid var(--sp-ochre); outline-offset: 3px; }
@media (max-width: 1024px) {
  body.arth-sp .e-con.sp-feed-meta { flex-direction: column; align-items: flex-start; gap: 12px; }
}
@media (max-width: 767px) {
  /* one card at a time, swipe sideways inside the section (never widens the page) */
  body.arth-sp .e-con.sp-feed-cards {
    display: flex !important; flex-direction: row; flex-wrap: nowrap !important; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
    gap: 12px; margin-inline: calc(var(--sp-gutter) * -1); padding-inline: var(--sp-gutter) !important;
    scroll-padding-inline: var(--sp-gutter); scrollbar-width: none;
    width: calc(100% + var(--sp-gutter) * 2) !important; max-width: none; box-sizing: border-box;
  }
  body.arth-sp .e-con.sp-feed-cards::-webkit-scrollbar { display: none; }
  body.arth-sp .e-con.sp-feed-card { flex: 0 0 82%; scroll-snap-align: start; }
}

/* --------------------------------------------------------------- 4. clients */
body.arth-sp .e-con.sp-clients {
  padding: clamp(44px, 5vw, 72px) var(--sp-gutter) !important; background: var(--sp-surface);
  display: flex; flex-direction: column; align-items: center; gap: clamp(24px, 3vw, 40px);
}
body.arth-sp .sp-clients-title .elementor-heading-title { font: 600 .72rem/1.4 var(--sp-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--sp-ink-60); text-align: center; }
body.arth-sp .e-con.sp-logos {
  display: grid !important; grid-template-columns: repeat(8, minmax(0, 1fr)); align-items: center; justify-items: center;
  column-gap: clamp(20px, 3vw, 48px); row-gap: 28px; width: 100%; max-width: var(--sp-max);
}
body.arth-sp .sp-logo { width: 100%; height: clamp(44px, 4.6vw, 64px); display: flex; align-items: center; justify-content: center; }
body.arth-sp .sp-logo > *, body.arth-sp .sp-logo a { height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; }
body.arth-sp .sp-logo img { max-height: 100%; max-width: min(100%, 118px); width: auto; height: auto; object-fit: contain; opacity: .88; transition: opacity .3s; }
body.arth-sp .sp-logo:hover img { opacity: 1; }

/* ------------------------------------------------------------------- 5. CTA */
body.arth-sp .e-con.sp-cta { background: var(--sp-navy); color: var(--sp-ivory); padding: var(--sp-pad) var(--sp-gutter) !important; display: flex; align-items: center; }
body.arth-sp .e-con.sp-cta-inner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; max-width: 720px; margin-inline: auto; }
body.arth-sp .sp-cta-title .elementor-heading-title { font: 500 clamp(1.6rem, 3.3vw, 2.8rem)/1.08 var(--sp-sans); letter-spacing: .03em; text-transform: uppercase; color: var(--sp-ivory); }
body.arth-sp .sp-cta-text p { font: 400 1rem/1.65 var(--sp-sans); color: rgba(245,244,235,.74); max-width: 46ch; margin-inline: auto; }
body.arth-sp .sp-cta .sp-btn { margin-top: 12px !important; }

/* ------------------------------------------------------------- responsive */
@media (max-width: 1024px) {
  body.arth-sp .e-con.sp-scope-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* tablet gallery: 3-column mosaic, lead image 2x2 (6 images; the 7th shows on desktop only) */
  body.arth-sp .e-con.sp-gal { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, clamp(170px, 26vw, 260px)); }
  body.arth-sp .sp-gal-item--lead { grid-column: 1 / 3; grid-row: 1 / 3; }
  body.arth-sp .sp-gal-item:nth-child(n+7) { display: none; }
  body.arth-sp .e-con.sp-logos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body.arth-sp .e-con.sp-hero { height: 40vh; min-height: 280px; }
  body.arth-sp .sp-hero-word { width: 84vw !important; }
  body.arth-sp .sp-hero-sub .elementor-heading-title { font-size: .66rem; letter-spacing: .26em; }

  body.arth-sp .e-con.sp-scope-grid { grid-template-columns: 1fr; border-bottom: 1px solid var(--sp-line); }
  body.arth-sp .e-con.sp-item { padding: 0 !important; display: grid; grid-template-columns: 34px 1fr 24px; align-items: center; }
  body.arth-sp .sp-item::before { display: none; }
  body.arth-sp .sp-item-num { grid-column: 1; grid-row: 1; }
  body.arth-sp .sp-item-title { grid-column: 2; grid-row: 1; }
  body.arth-sp .sp-item-title .elementor-heading-title { margin: 0; padding: 20px 0; font-size: .86rem; }
  body.arth-sp .sp-item-desc { grid-column: 1 / -1; grid-row: 2; margin: 0 0 22px 34px !important; }
  body.arth-sp .sp-item-desc p { max-width: none; }
  body.arth-sp .sp-item::after {
    content: ""; grid-column: 3; grid-row: 1; justify-self: end; width: 12px; height: 12px;
    background: linear-gradient(var(--sp-navy), var(--sp-navy)) center / 12px 1.5px no-repeat, linear-gradient(var(--sp-navy), var(--sp-navy)) center / 1.5px 12px no-repeat;
    transition: transform .4s var(--sp-ease);
  }
  body.arth-sp.sp-js .sp-item { cursor: pointer; }
  body.arth-sp.sp-js .sp-item.is-open::after { transform: rotate(45deg); }
  body.arth-sp.sp-js .sp-item .sp-item-desc { overflow: hidden; max-height: 0; opacity: 0; margin-bottom: 0 !important; transition: max-height .5s var(--sp-ease), opacity .35s, margin .5s var(--sp-ease); }
  body.arth-sp.sp-js .sp-item.is-open .sp-item-desc { max-height: 480px; opacity: 1; margin-bottom: 22px !important; }

  /* phone gallery: lead image full width, then a 2x2 grid (5 images, compact, no sideways scroll) */
  body.arth-sp .e-con.sp-gal { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-rows: auto; gap: 6px; }
  body.arth-sp .sp-gal-item, body.arth-sp .sp-gal-item--lead { grid-row: auto; grid-column: auto; height: auto !important; aspect-ratio: 4 / 5; }
  body.arth-sp .sp-gal-item > *, body.arth-sp .sp-gal-item img { height: 100% !important; }
  body.arth-sp .sp-gal-item--lead { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
  body.arth-sp .sp-gal-item:nth-child(n+6) { display: none; }
  body.arth-sp .e-con.sp-gallery-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  body.arth-sp .e-con.sp-logos { column-gap: 10px; row-gap: 24px; }
  body.arth-sp .sp-logo { height: 46px; }
  body.arth-sp .sp-logo img { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  body.arth-sp .sp *, body.arth-sp .sp *::before, body.arth-sp .sp *::after { transition: none !important; }
}

/* Elementor editor: everything visible and in flow */
body.elementor-editor-active.arth-sp .sp-item .sp-item-desc { max-height: none !important; opacity: 1 !important; }

/* ======================================================= Our Clients page */
/* ------ client wall: Home's Clientele panel, same markup and look, in normal page flow ------ */
body.arth-sp .e-con.sp-wall { --navy: #021C41; --line: rgba(2, 28, 65, .14);
  font-family: "Montserrat", "Helvetica Neue", Arial, sans-serif; color: var(--navy); background: #F5F4EB; display: block !important; }
body.arth-sp .sp-wall .e-con[class*="ar3-"], body.arth-sp .sp-wall .e-con.cl-head { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px; --min-height: 0; }
body.arth-sp .sp-wall :where(.elementor-widget) .elementor-widget-container { margin: 0; padding: 0; }
body.arth-sp .sp-wall img { display: block; max-width: 100%; height: auto; }
body.arth-sp .sp-wall .e-con.ar3-trusted { display: flex !important; flex-direction: column !important; align-items: stretch !important;
  justify-content: center !important; width: 100% !important; height: 100vh; min-height: 620px !important; max-height: 1080px;
  padding: clamp(28px, 7vh, 72px) clamp(24px, 3.4vw, 60px) clamp(24px, 5.5vh, 56px) !important; background: #F5F4EB; }
body.arth-sp .sp-wall .e-con.ar3-tr-left { width: 100% !important; height: 100%; flex-direction: column !important;
  align-items: stretch !important; justify-content: flex-start; padding: 0 !important; background: transparent; }
body.arth-sp .sp-wall .e-con.cl-head { flex: 0 0 auto; display: flex !important; flex-direction: row !important;
  justify-content: space-between !important; align-items: flex-end !important; gap: 24px; width: 100%;
  padding-bottom: clamp(14px, 2.6vh, 26px) !important; margin-bottom: clamp(14px, 2.8vh, 28px); }
body.arth-sp .sp-wall .cl-sub { width: auto !important; margin: 0 !important; padding-bottom: .5em; }
body.arth-sp .sp-wall .cl-sub .elementor-heading-title { margin: 0; }
/* the ledger: 8 columns, hairlines between every cell */
body.arth-sp .sp-wall .e-con.ar3-tr-grid { flex: 1 1 auto; display: grid !important; width: 100%; min-height: 0;
  grid-template-columns: repeat(8, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr);
  gap: 1px !important; background: rgba(2, 28, 66, .14); border: 1px solid rgba(2, 28, 66, .14); padding: 0 !important;
  --lk: min(7.3vh, 4.6vw); }
body.arth-sp .sp-wall .ar3-logo { display: flex; align-items: center; justify-content: center; width: 100% !important; height: 100%;
  margin: 0 !important; background: #F5F4EB; transition: background-color .35s ease; }
body.arth-sp .sp-wall .ar3-logo .elementor-widget-container { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
/* optical sizing: --ar (width/height) is set per logo by arth-sp.js */
body.arth-sp .sp-wall .ar3-logo img { --ar: 3;
  height: clamp(12px, calc(var(--lk) / sqrt(var(--ar))), 76px) !important; width: auto !important;
  max-height: 68% !important; max-width: 84% !important; object-fit: contain; margin: 0 auto;
  transition: transform .5s cubic-bezier(.2,.7,.2,1); }
body.arth-sp .sp-wall .ar3-logo:hover { background: #EBE9DD; }
body.arth-sp .sp-wall .ar3-logo:hover img { transform: scale(1.06); }
body.arth-sp .sp-wall .e-con.cl-next { grid-column: span 4; display: flex !important; flex-direction: row !important;
  align-items: center !important; justify-content: space-between !important; gap: 20px;
  padding: 0 clamp(20px, 2.4vw, 40px) !important; background: #021C42; }
body.arth-sp .sp-wall .cl-next > .elementor-widget { width: auto !important; margin: 0 !important; }
body.arth-sp .sp-wall .cl-next-link .elementor-button { transition: background-color .3s ease, color .3s ease; }
body.arth-sp .sp-wall .cl-next-link .elementor-button-content-wrapper { gap: .7em; }

/* ------ image marquee: 5 images at 4:3, drifting right to left in a loop (JS doubles the set) ------ */
body.arth-sp .e-con.sp-marquee { --mq-w: clamp(300px, 29vw, 560px); --mq-gap: 16px; --mq-dur: 60s;
  display: block !important; overflow: hidden; background: #F5F4EB; padding: 0 0 var(--sp-pad) !important; }
body.arth-sp .e-con.sp-mq-track { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
  gap: var(--mq-gap) !important; width: max-content !important; max-width: none !important; padding: 0 !important; }
body.arth-sp .sp-mq-track.is-running { animation: sp-mq var(--mq-dur) linear infinite; will-change: transform; }
body.arth-sp .sp-mq-item { flex: 0 0 var(--mq-w) !important; width: var(--mq-w) !important; margin: 0 !important; }
body.arth-sp .sp-mq-item .elementor-widget-container { margin: 0; padding: 0; }
body.arth-sp .sp-mq-item img { display: block; width: 100% !important; height: auto !important; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; }
/* the track holds two copies of the set, so -50% (plus half a gap) is one seamless loop */
@keyframes sp-mq { to { transform: translate3d(calc(-50% - var(--mq-gap) / 2), 0, 0); } }

@media (max-width: 1024px) {
  body.arth-sp .e-con.sp-wall .e-con.ar3-trusted { height: auto; min-height: 0 !important; max-height: none;
    padding: clamp(44px, 7vw, 72px) var(--sp-gutter) !important; }
  body.arth-sp .sp-wall .e-con.ar3-tr-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: auto; --lk: 7.4vw; }
  body.arth-sp .sp-wall .ar3-logo { aspect-ratio: 4 / 3; height: auto; }
  body.arth-sp .sp-wall .e-con.cl-next { padding: 16px clamp(16px, 2.4vw, 32px) !important; }
  body.arth-sp .e-con.sp-marquee { --mq-w: 42vw; --mq-gap: 14px; --mq-dur: 48s; }
}
@media (max-width: 767px) {
  body.arth-sp .sp-wall .e-con.cl-head { justify-content: flex-start !important; }
  body.arth-sp .sp-wall .cl-sub .elementor-heading-title { white-space: normal; }
  body.arth-sp .sp-wall .e-con.ar3-tr-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); --lk: 12vw; }
  body.arth-sp .sp-wall .ar3-logo { aspect-ratio: 1 / 1; }
  body.arth-sp .sp-wall .ar3-logo img { max-width: 80% !important; }
  body.arth-sp .sp-wall .e-con.cl-next { padding: 18px 16px !important; gap: 12px; flex-wrap: wrap !important; }
  /* one full image + 70% of the next: w + gap + .7w = 100vw */
  body.arth-sp .e-con.sp-marquee { --mq-gap: 12px; --mq-w: calc((100vw - 12px) / 1.7); --mq-dur: 30s; }
}
@media (prefers-reduced-motion: reduce) {
  body.arth-sp .sp-mq-track.is-running { animation: none; }
  body.arth-sp .e-con.sp-marquee { overflow-x: auto; }
}

/* ========================================================== About Us page */
/* ivory hero without a photo: navy wordmark, one positioning line, a hairline to close it */
body.arth-sp .e-con.sp-hero--plain { background: var(--sp-ivory); border-bottom: 1px solid var(--sp-line); }
body.arth-sp .sp-hero--plain::after { display: none; }
body.arth-sp .sp-hero--plain .sp-hero-word { width: clamp(260px, 34vw, 520px) !important; }
body.arth-sp .sp .elementor-widget.ab-hero-line { padding-top: clamp(16px, 2vw, 26px); }
body.arth-sp .ab-hero-line p { font: 500 .72rem/1.9 var(--sp-sans); letter-spacing: .26em; text-transform: uppercase; color: var(--sp-navy); }
body.arth-sp .ab-br { display: none; }

/* shared */
body.arth-sp .ab-eyebrow p { font: 600 .66rem/1 var(--sp-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sp-berry); }
body.arth-sp .ab-h2 .elementor-heading-title { font: 300 clamp(1.7rem, 3vw, 2.8rem)/1.12 var(--sp-sans); letter-spacing: -.01em; color: var(--sp-navy); }

/* the studio: centred statement, short body, three facts */
body.arth-sp .e-con.sp-ab-intro { padding: var(--sp-pad) var(--sp-gutter) !important; background: var(--sp-ivory); }
body.arth-sp .ab-statement .elementor-heading-title { font: 300 clamp(2rem, 3.9vw, 3.6rem)/1.06 var(--sp-sans); letter-spacing: -.02em; color: var(--sp-navy); text-wrap: balance; }
body.arth-sp .ab-body p { max-width: 52ch; font: 400 1rem/1.75 var(--sp-sans); color: rgba(2, 28, 66, .78); }
body.arth-sp .ab-body strong { font-weight: 600; color: var(--sp-navy); }
body.arth-sp .sp .elementor-widget.ab-facts { padding-top: 8px; }
body.arth-sp .ab-facts-list, body.arth-sp .ab-facts-list li { list-style: none !important; }
body.arth-sp .ab-facts-list li::marker { content: none; }
body.arth-sp .ab-facts-list { list-style: none; margin: 0; padding: 22px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; border-top: 1px solid var(--sp-line); }
body.arth-sp .ab-facts-list li { margin: 0; }
body.arth-sp .ab-facts-list strong { display: block; font: 500 clamp(1.6rem, 2.4vw, 2.2rem)/1 var(--sp-sans); letter-spacing: -.02em; color: var(--sp-navy); }
body.arth-sp .ab-facts-list span { display: block; margin-top: 8px; font: 500 .7rem/1.45 var(--sp-sans); letter-spacing: .06em; text-transform: uppercase; color: rgba(2, 28, 66, .6); }


/* vision: three principles, numbered, between hairlines */
body.arth-sp .e-con.sp-ab-vision { position: relative; overflow: hidden; padding: clamp(48px, 5vw, 80px) var(--sp-gutter) clamp(40px, 4vw, 64px) !important; background: var(--sp-surface); }
body.arth-sp .sp-ab-vision > * { position: relative; z-index: 1; }
body.arth-sp .e-con.ab-vision-head { display: flex !important; flex-direction: column !important; gap: 14px; max-width: 760px; padding-bottom: clamp(24px, 2.8vw, 40px) !important; }
body.arth-sp .e-con.ab-prs { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--sp-line); }
body.arth-sp .e-con.ab-pr { display: flex !important; flex-direction: column !important; gap: 14px; padding: 28px clamp(18px, 2.4vw, 40px) 8px 0 !important; }
body.arth-sp .e-con.ab-pr + .ab-pr { padding-left: clamp(18px, 2.4vw, 40px) !important; border-left: 1px solid var(--sp-line); }
body.arth-sp .ab-pr-num p { font: 500 .78rem/1 var(--sp-sans); letter-spacing: .14em; color: var(--sp-ochre); }
body.arth-sp .ab-pr-title .elementor-heading-title { font: 500 clamp(1.25rem, 1.8vw, 1.6rem)/1.15 var(--sp-sans); color: var(--sp-navy); }
body.arth-sp .ab-pr-text p { max-width: 38ch; font: 400 .95rem/1.7 var(--sp-sans); color: rgba(2, 28, 66, .74); }

/* founders: quote, then the pinned story (cards + timeline) */
body.arth-sp .e-con.sp-ab-founders { padding: clamp(56px, 6vw, 96px) var(--sp-gutter) clamp(48px, 5vw, 80px) !important; background: var(--sp-ivory); }
body.arth-sp .e-con.ab-fd-head { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr); gap: clamp(24px, 4vw, 64px); align-items: start; padding-bottom: clamp(8px, 1.4vw, 20px) !important; }
body.arth-sp .ab-quote blockquote { margin: 0; padding: 0; border: 0; }
body.arth-sp .ab-quote blockquote p { font: 300 clamp(1.3rem, 2.2vw, 2rem)/1.35 var(--sp-sans); letter-spacing: -.01em; color: var(--sp-navy); text-wrap: pretty; }
body.arth-sp .ab-quote cite { display: block; margin-top: 16px; font: 600 .66rem/1 var(--sp-sans); font-style: normal; letter-spacing: .2em; text-transform: uppercase; color: var(--sp-berry); }
body.arth-sp .e-con.ab-fds { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
body.arth-sp .e-con.ab-fd { display: grid !important; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(16px, 2vw, 28px); align-items: end;
  padding-top: 20px !important; border-top: 1px solid var(--sp-navy); }
body.arth-sp .ab-fd-img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; display: block; filter: grayscale(1) contrast(1.04); transition: filter .6s ease; }
body.arth-sp .ab-fd:hover .ab-fd-img img { filter: grayscale(0); }
body.arth-sp .e-con.ab-fd-body { display: flex !important; flex-direction: column !important; gap: 10px; }
body.arth-sp .ab-fd-name .elementor-heading-title { font: 500 clamp(1.3rem, 1.9vw, 1.7rem)/1.1 var(--sp-sans); color: var(--sp-navy); }
body.arth-sp .ab-fd-role p { font: 600 .64rem/1.5 var(--sp-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--sp-berry); }
body.arth-sp .ab-fd-bio p { margin-top: 4px; font: 400 .92rem/1.7 var(--sp-sans); color: rgba(2, 28, 66, .76); }

@media (max-width: 1024px) {
  body.arth-sp .e-con.ab-fd-head { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  /* tablet keeps photo + text side by side so both founders and the timeline fit one screen */
  body.arth-sp .e-con.ab-fd { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 16px; }
  body.arth-sp .ab-fd-bio p { font-size: .82rem; line-height: 1.6; }
}
@media (max-width: 767px) {
  body.arth-sp .ab-hero-line p { letter-spacing: .2em; font-size: .66rem; }
  body.arth-sp .ab-dot { display: none; }
  body.arth-sp .ab-br { display: inline; }
  body.arth-sp .ab-facts-list { gap: 12px; }
  body.arth-sp .ab-facts-list span { font-size: .6rem; letter-spacing: .04em; }
  body.arth-sp .e-con.ab-prs { grid-template-columns: minmax(0, 1fr); }
  body.arth-sp .e-con.ab-pr, body.arth-sp .e-con.ab-pr + .ab-pr { padding: 24px 0 26px !important; border-left: 0; }
  body.arth-sp .e-con.ab-pr + .ab-pr { border-top: 1px solid var(--sp-line); }
  body.arth-sp .e-con.ab-fds { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  body.arth-sp .ab-fd-bio p { font-size: .82rem; line-height: 1.6; }
}

/* banner: full-width campaign image right after the heading */
body.arth-sp .e-con.sp-ab-banner { padding: clamp(40px, 5vw, 72px) var(--sp-gutter) 0 !important; background: var(--sp-ivory); }
body.arth-sp .e-con.ab-banner { position: relative; display: block !important; }
body.arth-sp .ab-banner-img img { display: block; width: 100%; aspect-ratio: 21 / 9; object-fit: cover; object-position: center 38%; }
body.arth-sp .sp .elementor-widget.ab-banner-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 80px clamp(18px, 2.6vw, 40px) clamp(18px, 2.4vw, 34px);
  background: linear-gradient(0deg, rgba(2, 28, 66, .7), transparent); pointer-events: none; }
body.arth-sp .ab-banner-cap p { font: 300 clamp(1.2rem, 2.4vw, 2.2rem)/1.1 var(--sp-sans); letter-spacing: -.01em; text-transform: uppercase; color: #fff; }
body.arth-sp .ab-banner-cap strong { font-weight: 600; }

/* the studio, centred under the banner */
body.arth-sp .e-con.ab-intro-c { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 22px; max-width: 1180px; text-align: center; }
body.arth-sp .ab-intro-c > .elementor-widget { width: 100%; }
body.arth-sp .ab-intro-c .ab-body p { margin-inline: auto; max-width: 84ch; }
body.arth-sp .ab-intro-c .ab-facts-list { max-width: 1000px; margin-inline: auto; }

/* ---------------- founders story: pinned stage + animated timeline ----------------
   JS (arth-sp.js) adds .is-on to .ab-pin on tablet/desktop and steps .tl2 through s1-s4 as you scroll.
   Without JS (and on phones) everything shows in its final state. */
body.arth-sp .e-con.ab-pin { position: relative; display: block !important; }
body.arth-sp .e-con.ab-stage { display: block !important; }
body.arth-sp .e-con.ab-stage-in { display: block !important; width: 100%; }
body.arth-sp .sp .elementor-widget.ab-tl2 { padding-top: clamp(40px, 6vh, 72px); }
body.arth-sp .ab-pin.is-on { height: 360vh; }
body.arth-sp .ab-pin.is-on .e-con.ab-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; width: calc(100% + var(--sp-gutter) * 2) !important; max-width: none; margin-inline: calc(var(--sp-gutter) * -1); padding-inline: var(--sp-gutter) !important; box-sizing: border-box; }
body.arth-sp .ab-pin.is-on .e-con.ab-stage-in { transform: translate3d(0, var(--ab-y, 0px), 0); transition: transform 1s cubic-bezier(.22, .8, .2, 1); will-change: transform; }
body.arth-sp .ab-pin.is-on .e-con.ab-fds { transition: opacity .8s ease; }
body.arth-sp .ab-pin.is-on.s4 .e-con.ab-fds { opacity: .18; }

body.arth-sp .tl2 { position: relative; --tl2-ease: cubic-bezier(.22, .8, .2, 1); }
body.arth-sp .tl2-row { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.arth-sp .tl2-track { position: absolute; top: 4px; left: 4px; right: 4px; height: 1px; background: var(--sp-line); }
body.arth-sp .tl2-fill { position: absolute; top: -.5px; height: 2px; width: 50%; background: var(--sp-navy); transition: width 1.2s var(--tl2-ease); }
body.arth-sp .tl2-fill--l { left: 0; } body.arth-sp .tl2-fill--r { right: 0; }
/* a glowing head runs along each line toward 2020 */
body.arth-sp .tl2-fill::after { content: ""; position: absolute; top: 50%; width: 11px; height: 11px; margin-top: -5.5px; border-radius: 50%; background: var(--sp-ochre);
  box-shadow: 0 0 0 6px rgba(216, 155, 101, .22); opacity: 0; transition: opacity .4s ease; }
body.arth-sp .tl2-fill--l::after { right: -5px; } body.arth-sp .tl2-fill--r::after { left: -5px; }
body.arth-sp .tl2-pt { position: relative; padding-top: 30px; }
body.arth-sp .tl2-dot { position: absolute; top: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--sp-navy); transition: transform .5s var(--tl2-ease), background-color .4s, box-shadow .4s; }
body.arth-sp .tl2-pt--l .tl2-dot { left: 0; }
body.arth-sp .tl2-pt--r { text-align: right; } body.arth-sp .tl2-pt--r .tl2-dot { right: 0; }
body.arth-sp .tl2-pt--c { text-align: center; } body.arth-sp .tl2-pt--c .tl2-dot { left: 50%; margin-left: -4.5px; background: var(--sp-berry); }
body.arth-sp .tl2-pt strong { display: block; font: 500 1.4rem/1 var(--sp-sans); letter-spacing: -.01em; color: var(--sp-navy); }
body.arth-sp .tl2-pt span { display: block; max-width: 34ch; margin-top: 10px; font: 400 .9rem/1.6 var(--sp-sans); color: rgba(2, 28, 66, .72); transition: opacity .6s ease; }
body.arth-sp .tl2-pt--r span { margin-left: auto; }
/* 2020 -> arth: the logo sits on the line as the centre node */
body.arth-sp .tl2-year { transition: opacity .5s ease, transform .6s var(--tl2-ease); opacity: 0; transform: scale(.7); }
body.arth-sp .tl2-logo { position: absolute; top: 4px; left: 50%; width: clamp(96px, 9vw, 130px); height: auto; padding: 0 14px; box-sizing: content-box; background: var(--sp-ivory);
  transform: translate(-50%, -50%) scale(1); transition: opacity .6s ease .15s, transform .8s var(--tl2-ease) .15s; }
/* then the line turns down to the outcome */
body.arth-sp .tl2-down { display: flex; flex-direction: column; align-items: center; text-align: center; }
body.arth-sp .tl2-vline { display: block; width: 2px; height: clamp(48px, 8vh, 84px); margin-top: -24px; background: var(--sp-navy); transform-origin: top; transition: transform .9s var(--tl2-ease); }
/* outcome lockup: a large counting "50+" | hairline | two lines + kicker */
body.arth-sp .tl2-out { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); margin-top: 18px; text-align: left; }
body.arth-sp .tl2-num { position: relative; margin: 0 !important; padding-right: clamp(18px, 2.4vw, 36px); border-right: 1px solid var(--sp-navy);
  font: 200 clamp(4.2rem, 8vw, 7.6rem)/.82 var(--sp-sans); letter-spacing: -.05em; color: var(--sp-navy); font-variant-numeric: tabular-nums;
  transition: opacity .6s ease .45s, transform .9s var(--tl2-ease) .45s, border-color .6s ease; }
body.arth-sp .tl2-plus { display: inline-block; margin-left: .04em; font-weight: 300; font-size: .52em; vertical-align: .72em; color: var(--sp-ochre); }
body.arth-sp .tl2-txt { display: flex; flex-direction: column; gap: 2px; transition: opacity .7s ease .75s, transform .9s var(--tl2-ease) .75s; }
body.arth-sp .tl2-l1, body.arth-sp .tl2-l2 { margin: 0 !important; font: 300 clamp(1.5rem, 2.6vw, 2.4rem)/1.1 var(--sp-sans); letter-spacing: -.015em; color: var(--sp-navy); }
body.arth-sp .tl2-l2 em { font-style: normal; font-weight: 500; color: var(--sp-berry); }
body.arth-sp .tl2-kicker { margin: 12px 0 0 !important; font: 600 .64rem/1 var(--sp-sans); letter-spacing: .22em; text-transform: uppercase; color: rgba(2, 28, 66, .56); }

/* animated states (only while .is-anim; each step class is cumulative) */
body.arth-sp .tl2.is-anim:not(.s2) .tl2-fill { width: 0; }
body.arth-sp .tl2.is-anim.s2:not(.s3) .tl2-fill::after { opacity: 1; }
body.arth-sp .tl2.is-anim.s1:not(.s2) .tl2-pt--l .tl2-dot, body.arth-sp .tl2.is-anim.s1:not(.s2) .tl2-pt--r .tl2-dot {
  background: var(--sp-ochre); transform: scale(1.6); box-shadow: 0 0 0 5px rgba(216, 155, 101, .25); animation: tl2-pulse 1.6s ease-in-out infinite; }
@keyframes tl2-pulse { 50% { box-shadow: 0 0 0 10px rgba(216, 155, 101, 0); } }
body.arth-sp .tl2.is-anim.s1:not(.s2) .tl2-pt--l strong, body.arth-sp .tl2.is-anim.s1:not(.s2) .tl2-pt--r strong { color: var(--sp-berry); }
body.arth-sp .tl2.is-anim.s2 .tl2-pt--l span, body.arth-sp .tl2.is-anim.s2 .tl2-pt--r span { opacity: .5; }
body.arth-sp .tl2.is-anim:not(.s3) .tl2-year { opacity: 1; transform: none; }
body.arth-sp .tl2.is-anim:not(.s3) .tl2-logo { opacity: 0; transform: translate(-50%, -50%) scale(.4); }
body.arth-sp .tl2.is-anim.s3 .tl2-pt--c .tl2-dot { transform: scale(0); }
body.arth-sp .tl2.is-anim:not(.s4) .tl2-vline { transform: scaleY(0); }
body.arth-sp .tl2.is-anim:not(.s4) .tl2-num { opacity: 0; transform: translateX(-24px); border-color: transparent; transition: opacity .3s ease, transform .3s ease, border-color .3s; }
body.arth-sp .tl2.is-anim:not(.s4) .tl2-txt { opacity: 0; transform: translateX(24px); transition: opacity .3s ease, transform .3s ease; }

/* phones: static, a vertical timeline in date order (animation to be agreed) */
@media (max-width: 767px) {
  body.arth-sp .e-con.sp-ab-banner { padding-top: 28px !important; }
  body.arth-sp .ab-banner-img img { aspect-ratio: 4 / 3; }
  body.arth-sp .sp .elementor-widget.ab-banner-cap { padding: 50px 16px 16px; }
  body.arth-sp .e-con.ab-fd { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  body.arth-sp .tl2-row { grid-template-columns: minmax(0, 1fr); margin-left: 4px; padding-left: 22px; border-left: 1px solid var(--sp-line); }
  body.arth-sp .tl2-track { display: none; }
  body.arth-sp .tl2-pt, body.arth-sp .tl2-pt--r, body.arth-sp .tl2-pt--c { padding: 0 0 26px; text-align: left; }
  body.arth-sp .tl2-pt--l { order: 1; } body.arth-sp .tl2-pt--r { order: 2; } body.arth-sp .tl2-pt--c { order: 3; padding-bottom: 0; }
  body.arth-sp .tl2-pt .tl2-dot, body.arth-sp .tl2-pt--r .tl2-dot, body.arth-sp .tl2-pt--c .tl2-dot { top: 5px; left: -27px; right: auto; margin: 0; }
  body.arth-sp .tl2-pt--r span { margin-left: 0; }
  body.arth-sp .tl2-year { opacity: 1; transform: none; }
  body.arth-sp .tl2-logo { position: static; display: block; width: 92px; padding: 0; margin-top: 12px; transform: none; }
  body.arth-sp .tl2-down { align-items: flex-start; text-align: left; padding-top: 30px; }
  body.arth-sp .tl2-vline { display: none; }
  body.arth-sp .tl2-out { margin-top: 0; gap: 16px; }
  body.arth-sp .tl2-num { padding-right: 16px; font-size: 4.2rem; }
  body.arth-sp .tl2-l1, body.arth-sp .tl2-l2 { font-size: 1.35rem; }
  body.arth-sp .tl2-kicker { margin-top: 8px !important; font-size: .56rem; }
  /* option 2: steps play as the timeline scrolls into view (no pinning) */
  body.arth-sp .tl2-row::before { content: ""; position: absolute; left: -1px; top: 0; width: 2px; height: 100%; background: var(--sp-navy); transform-origin: top; transition: transform 1.4s var(--tl2-ease); }
  body.arth-sp .tl2.is-anim:not(.s2) .tl2-row::before { transform: scaleY(0); }
  body.arth-sp .tl2.is-anim .tl2-year { opacity: 1; transform: none; }
  body.arth-sp .tl2.is-anim.s3 .tl2-pt--c .tl2-dot { transform: none; }
  body.arth-sp .tl2.is-anim:not(.s3) .tl2-logo { opacity: 0; transform: translateY(10px) scale(.92); }
  body.arth-sp .tl2.is-anim .tl2-logo { transform-origin: left center; }
  body.arth-sp .tl2.is-anim:not(.s4) .tl2-num { transform: translateY(16px); }
  body.arth-sp .tl2.is-anim:not(.s4) .tl2-txt { transform: translateY(16px); }
}
@media (prefers-reduced-motion: reduce) {
  body.arth-sp .tl2 *, body.arth-sp .ab-pin * { transition: none !important; animation: none !important; }
}

/* About Us: desktop hero at 40vh (other pages keep 50vh) */
@media (min-width: 1025px) { body.arth-sp--about-us .e-con.sp-hero, body.arth-sp--contact-us .e-con.sp-hero { height: 40vh; } }

/* house rule: no italics anywhere on the service pages */
body.arth-sp .sp em, body.arth-sp .sp i, body.arth-sp .sp cite { font-style: normal; }

/* About Us, round 3-4 */
/* studios fact: "Studios", then the cities as a small grey note on one line (italic on phones only,
   the one italic exception on the site, at the user's request) */
body.arth-sp .ab-facts-list .ab-sep { display: none; }
body.arth-sp .ab-facts-list .ab-note { display: block; margin-top: 6px; font: 400 .74rem/1.3 var(--sp-sans); font-style: normal; letter-spacing: .02em; text-transform: none;
  white-space: nowrap; color: rgba(2, 28, 66, .5); }
/* hero: the cities sit a shade lighter than the positioning line */
body.arth-sp .ab-hero-line .ab-cities { color: rgba(2, 28, 66, .5); }
@media (min-width: 1025px) {
  /* vision heading centred, on one line */
  body.arth-sp .e-con.ab-vision-head { align-items: center !important; text-align: center; margin-inline: auto; max-width: none; }
  body.arth-sp .ab-vision-head .ab-h2 .elementor-heading-title { white-space: nowrap; text-wrap: nowrap; }
}
@media (max-width: 767px) {
  body.arth-sp .ab-facts-list .ab-note { margin-top: 5px; font-size: clamp(.56rem, 2.5vw, .66rem); font-style: italic; letter-spacing: 0; }
  /* hero: 30vh on phones; the positioning line on one line, the cities below */
  body.arth-sp--about-us .e-con.sp-hero, body.arth-sp--contact-us .e-con.sp-hero { height: 30vh; min-height: 210px; }
  body.arth-sp--about-us .e-con.sp-hero-inner, body.arth-sp--contact-us .e-con.sp-hero-inner { padding-top: 48px !important; }
  body.arth-sp .ab-hero-line p { font-size: clamp(.5rem, 2.55vw, .64rem); letter-spacing: .14em; white-space: nowrap; }
  /* founders: both portraits the same size, level with each other, names level below */
  body.arth-sp .e-con.ab-fd { align-items: start !important; align-content: start; grid-template-rows: auto 1fr; }
  body.arth-sp .ab-fd-img img { aspect-ratio: 4 / 5; height: auto; }
}

/* ======================================================== Contact Us page */
body.arth-sp .e-con.sp-ct { padding: clamp(56px, 6vw, 96px) var(--sp-gutter) !important; background: var(--sp-ivory); }
body.arth-sp .e-con.ct-grid { display: grid !important; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 110px); align-items: start; }
body.arth-sp .e-con.ct-form { display: flex !important; flex-direction: column !important; gap: 14px; }
body.arth-sp .ct-h2 .elementor-heading-title { font: 300 clamp(1.8rem, 3.2vw, 2.9rem)/1.1 var(--sp-sans); letter-spacing: -.015em; color: var(--sp-navy); }
body.arth-sp .sp .elementor-widget.ct-ff { padding-top: clamp(14px, 2vw, 24px); }

/* Fluent Forms, in the house style: hairline fields, navy pill button */
body.arth-sp .ct-ff .fluentform form fieldset { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; }
body.arth-sp .ct-ff .fluentform .ff-el-group { grid-column: 1 / -1; margin: 0 0 22px; }
body.arth-sp .ct-ff .fluentform .ff-el-group.ff-half { grid-column: span 1; }
body.arth-sp .ct-ff .fluentform legend, body.arth-sp .ct-ff .fluentform input[type="hidden"] { grid-column: 1 / -1; }
body.arth-sp .ct-ff .fluentform .ff-el-input--label { margin-bottom: 8px; }
body.arth-sp .ct-ff .fluentform .ff-el-input--label label { font: 600 .64rem/1 var(--sp-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--sp-navy); }
body.arth-sp .ct-ff .fluentform .ff-el-is-required.asterisk-right label:after { color: var(--sp-berry); margin-left: 3px; }
body.arth-sp .ct-ff .fluentform .ff-el-form-control { width: 100%; padding: 12px 0 11px; border: 0; border-bottom: 1px solid rgba(2, 28, 66, .28); border-radius: 0; background: transparent; box-shadow: none;
  font: 400 1rem/1.4 var(--sp-sans); color: var(--sp-navy); transition: border-color .3s ease; }
body.arth-sp .ct-ff .fluentform .ff-el-form-control::placeholder { color: rgba(2, 28, 66, .38); }
body.arth-sp .ct-ff .fluentform .ff-el-form-control:focus { outline: none; border-bottom-color: var(--sp-navy); box-shadow: 0 1px 0 0 var(--sp-navy); }
body.arth-sp .ct-ff .fluentform select.ff-el-form-control { appearance: none; -webkit-appearance: none; padding-right: 26px; cursor: pointer;
  background: transparent no-repeat right 4px center / 10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23021C42' stroke-width='1.3'/%3E%3C/svg%3E"); }
body.arth-sp .ct-ff .fluentform textarea.ff-el-form-control { min-height: 120px; resize: vertical; }
body.arth-sp .ct-ff .fluentform .ff-el-is-error .ff-el-form-control { border-bottom-color: var(--sp-berry); }
body.arth-sp .ct-ff .fluentform .error, body.arth-sp .ct-ff .fluentform .text-danger { margin-top: 6px; font: 500 .72rem/1.4 var(--sp-sans); color: var(--sp-berry); }
body.arth-sp .ct-ff .fluentform .ff_submit_btn_wrapper { margin: 8px 0 0; }
body.arth-sp .ct-ff .fluentform .ff-btn-submit { display: inline-flex; align-items: center; gap: 12px; padding: 1.2em 2.2em !important; border: 1px solid var(--sp-navy) !important; border-radius: 999px !important;
  background: var(--sp-navy) !important; color: var(--sp-ivory) !important; font: 600 .74rem/1 var(--sp-sans) !important; letter-spacing: .16em; text-transform: uppercase; box-shadow: none !important; transition: background-color .3s ease, color .3s ease; }
body.arth-sp .ct-ff .fluentform .ff-btn-submit::after { content: "\2192"; font-size: 1rem; letter-spacing: 0; }
body.arth-sp .ct-ff .fluentform .ff-btn-submit:hover, body.arth-sp .ct-ff .fluentform .ff-btn-submit:focus-visible { background: var(--sp-berry) !important; border-color: var(--sp-berry) !important; color: #fff !important; opacity: 1; }
body.arth-sp .ct-ff .ff-message-success { padding: 28px 30px; border: 1px solid var(--sp-line); border-radius: 0; background: var(--sp-surface); box-shadow: none; font: 400 1rem/1.6 var(--sp-sans); color: var(--sp-navy); }
body.arth-sp .ct-ff .ff-message-success p { margin: 0 0 6px; }

/* details column */
body.arth-sp .e-con.ct-side { display: block !important; padding-top: 6px !important; }
body.arth-sp .ct-info { display: flex; flex-direction: column; border-top: 1px solid var(--sp-navy); }
body.arth-sp .ct-blk { padding: 22px 0; border-bottom: 1px solid var(--sp-line); }
body.arth-sp .ct-lbl { margin: 0 0 10px !important; font: 600 .62rem/1 var(--sp-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sp-berry); }
body.arth-sp .ct-val { margin: 0 !important; font: 400 clamp(1.05rem, 1.4vw, 1.25rem)/1.4 var(--sp-sans); color: var(--sp-navy); word-break: break-word; }
body.arth-sp .ct-val a { color: inherit; text-decoration: none; background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px; transition: background-size .35s ease; }
body.arth-sp .ct-val a:hover { background-size: 100% 1px; }
body.arth-sp .ct-studios { list-style: none !important; margin: 0; padding: 0; display: grid; gap: 14px; }
body.arth-sp .ct-studios li { list-style: none !important; margin: 0; }
body.arth-sp .ct-studios li::marker { content: none; }
body.arth-sp .ct-studios strong { display: block; font: 500 1.05rem/1.3 var(--sp-sans); color: var(--sp-navy); }
body.arth-sp .ct-studios span { display: block; margin-top: 3px; font: 400 .9rem/1.55 var(--sp-sans); color: rgba(2, 28, 66, .6); }

/* what happens next: reuses the Vision look */
body.arth-sp .e-con.sp-ct-next { padding: clamp(48px, 5vw, 80px) var(--sp-gutter) clamp(48px, 5vw, 80px) !important; }

@media (max-width: 1024px) {
  body.arth-sp .e-con.ct-grid { grid-template-columns: minmax(0, 1fr); gap: 44px; }
}
@media (max-width: 767px) {
  body.arth-sp .e-con.sp-ct { padding: 44px var(--sp-gutter) 52px !important; }
  body.arth-sp .ct-ff .fluentform form fieldset { grid-template-columns: minmax(0, 1fr); }
  body.arth-sp .ct-ff .fluentform .ff-el-group.ff-half { grid-column: 1 / -1; }
  body.arth-sp .ct-ff .fluentform .ff-el-group { margin-bottom: 18px; }
  body.arth-sp .ct-ff .fluentform .ff-el-form-control { font-size: 16px; } /* no zoom on iPhone */
  body.arth-sp .ct-ff .fluentform .ff-btn-submit { width: 100%; justify-content: center; }
}
/* contact details: no rule above the first block on desktop; city names only until addresses are added */
@media (min-width: 1025px) { body.arth-sp .ct-info { border-top: 0; } body.arth-sp .ct-blk:first-child { padding-top: 0; } }
body.arth-sp .ct-studios--cities { gap: 6px; }


/* Contact hero: wordmark and caption sit closer, centred in the space below the header */
body.arth-sp--contact-us .e-con.sp-hero-inner { padding-top: 70px !important; }
body.arth-sp--contact-us .sp-hero-word img { aspect-ratio: 1536 / 366; object-fit: cover; object-position: top; }
body.arth-sp--contact-us .sp .elementor-widget.ab-hero-line { padding-top: clamp(8px, 1vw, 14px); }
@media (max-width: 1024px) { body.arth-sp--contact-us .e-con.sp-hero-inner { padding-top: 72px !important; } }
@media (max-width: 767px) { body.arth-sp--contact-us .e-con.sp-hero-inner { padding-top: 60px !important; } }


/* ======================================================== Policy pages (Privacy Policy, Terms & Conditions) */
/* plain ivory hero: a text title (no wordmark) and the "last updated" line, centred below the header */
body.arth-sp .e-con.sp-hero--legal { height: 30vh; min-height: 240px; max-height: 420px; }
body.arth-sp .sp-hero--legal .e-con.sp-hero-inner { padding-top: 70px !important; }
body.arth-sp .sp-legal-title .elementor-heading-title { margin: 0; font: 400 clamp(2rem, 4.6vw, 3.6rem)/1.08 var(--sp-sans); letter-spacing: .02em; text-transform: uppercase; color: var(--sp-navy); }
body.arth-sp .sp-hero--legal .elementor-widget.ab-hero-line { padding-top: clamp(10px, 1.2vw, 16px); }
@media (max-width: 1024px) { body.arth-sp .sp-hero--legal .e-con.sp-hero-inner { padding-top: 72px !important; } }
@media (max-width: 767px) {
  body.arth-sp .e-con.sp-hero--legal { height: 26vh; min-height: 200px; }
  body.arth-sp .sp-hero--legal .e-con.sp-hero-inner { padding-top: 60px !important; }
}
body.arth-sp .e-con.sp-legal { background: var(--sp-ivory); padding: clamp(48px, 6vw, 96px) var(--sp-gutter) clamp(64px, 8vw, 120px) !important; }
body.arth-sp .sp-legal-body { width: 100%; max-width: 760px; margin: 0 auto; }
body.arth-sp .sp-legal-body h2 { margin: 2.6em 0 .9em; font: 500 .82rem/1.4 var(--sp-sans); letter-spacing: .2em; text-transform: uppercase; color: var(--sp-navy); }
body.arth-sp .sp-legal-body > h2:first-child, body.arth-sp .sp-legal-body .elementor-widget-container > h2:first-child { margin-top: 0; }
body.arth-sp .sp-legal-body p, body.arth-sp .sp-legal-body li { margin: 0 0 1.05em; font: 400 1rem/1.8 var(--sp-sans); letter-spacing: 0; color: rgba(2, 28, 66, .78); }
body.arth-sp .sp-legal-body ul { margin: 0 0 1.2em; padding-left: 1.2em; }
body.arth-sp .sp-legal-body li { margin-bottom: .4em; }
body.arth-sp .sp-legal-body strong { font-weight: 600; color: var(--sp-navy); }
body.arth-sp .sp-legal-body a { color: var(--sp-navy); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
body.arth-sp .sp-legal-body a:hover { color: #9B3656; }
@media (max-width: 767px) { body.arth-sp .sp-legal-body p, body.arth-sp .sp-legal-body li { font-size: .95rem; line-height: 1.75; } }

body.arth-sp .e-con.sp-legal > .elementor-widget.sp-legal-body { width: 100% !important; max-width: 760px !important; margin-inline: auto !important; align-self: center; }