/* ar-theme.css — the arounda.agency dark theme for every INNER page (2026-10-30).
   The home is ArHome.tsx and carries its own styles; this sheet reskins the ~500 inner pages
   (services, pricing, portfolio, case studies, journal, contact, solutions, team, terms...) by
   flipping the nd-system.css tokens and the handful of hard-coded white surfaces, under
   html[data-theme="ar"], which index.html sets on <html>. Loaded LAST so it wins every tie.
   Palette is the Third Axis mark: cobalt glow (x), violet tint (y), amber call pill (z). */

html[data-theme="ar"] {
  --nd-ground:    #0A0A0D;
  --nd-ground-2:  #141418;
  --nd-ground-3:  #1B1B21;
  --nd-band:      #111115;
  --nd-ink:       #FFFFFF;
  --nd-ink-2:     #D7DAE1;
  --nd-ink-3:     #A3A8B3;
  --nd-ink-4:     #6C7280;
  --nd-line:      rgba(255,255,255,.12);
  --nd-line-2:    rgba(255,255,255,.07);
  --nd-accent:      #6B9BFF;
  --nd-accent-ink:  #9DBBFF;
  --nd-accent-soft: rgba(31,73,230,.18);
  --nd-plate:     #141418;
  --nd-wash-lo:   #0F1A3F;
  --nd-wash-mid:  #0C0F1E;
  --nd-cta:       #FFF83F;
  --nd-cta-ink:   #FFFA7A;
  --nd-slab-bg:   #141418;
  --nd-shadow-card: 0 20px 50px -30px rgba(0,0,0,.8);
  --nd-serif: "Instrument Serif","Instrument Serif Fallback", Georgia, serif;
  background: #0A0A0D;
  color-scheme: dark;
}
html[data-theme="ar"] body { background: #0A0A0D !important; color: #FFFFFF; }

/* ---------- type ---------- */
html[data-theme="ar"] .nd-plane,
html[data-theme="ar"] .nd-plane h1, html[data-theme="ar"] .nd-plane h2, html[data-theme="ar"] .nd-plane h3,
html[data-theme="ar"] .nd-plane h4, html[data-theme="ar"] .nd-plane .nd-display, html[data-theme="ar"] .nd-plane .nd-h2,
html[data-theme="ar"] .nd-plane .nd-h3 { color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane h1, html[data-theme="ar"] .nd-plane h2, html[data-theme="ar"] .nd-plane .nd-display,
html[data-theme="ar"] .nd-plane .nd-h2 { font-weight: 500 !important; letter-spacing: -.03em !important; }
html[data-theme="ar"] .nd-plane p, html[data-theme="ar"] .nd-plane li, html[data-theme="ar"] .nd-plane dd,
html[data-theme="ar"] .nd-plane .nd-lead, html[data-theme="ar"] .nd-plane span { color: #D7DAE1; }
html[data-theme="ar"] .nd-plane .nd-lead { color: #A3A8B3 !important; }
html[data-theme="ar"] .nd-plane .nd-serif-accent,
html[data-theme="ar"] .nd-plane :is(h1,h2,h3,.nd-display,.nd-h2,.nd-h3) :is(em,.nd-serif-accent) {
  font-family: "Instrument Serif","Instrument Serif Fallback", Georgia, serif !important; font-style: italic !important; font-weight: 400 !important;
  color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF; letter-spacing: 0 !important; }
html[data-theme="ar"] .nd-plane a { color: #FFFFFF; }
html[data-theme="ar"] .nd-plane a:hover { color: #9DBBFF; }

/* ---------- surfaces: every white card becomes a dark card with a hairline ---------- */
html[data-theme="ar"] .nd-plane :is(.nd-card2, .nd-bcard, .nd-ccard, .nd-fcard, .nd-pcard, .nd-person, .nd-tcard,
  .nd-faq details, .nd-slab, .nd-benefit__card, .nd-icol, .nd-stat, .nd-bcell, .nd-banner, .nd-cl__tile,
  .pc, .ws-card, .pt-b, .fc-panel, .ps-quote, .nd-hero-dark, .nd-case, .nd-srow__text, .nd-slab-steps li,
  .nd-sfoot .nd-card2) {
  background: #141418 !important; border: 1px solid rgba(255,255,255,.1) !important; color: #FFFFFF;
  box-shadow: 0 20px 50px -30px rgba(0,0,0,.8) !important; }
html[data-theme="ar"] .nd-plane :is(.nd-bcard__plate, .nd-card2__icon, .nd-fcard__icon, .nd-pcard__head) { background: #1B1B21 !important; border-color: rgba(255,255,255,.08) !important; }
html[data-theme="ar"] .nd-plane .nd-band-grey, html[data-theme="ar"] .nd-plane .nd-section--grey { background: #111115 !important; }
html[data-theme="ar"] .nd-plane :is(.nd-cl__tile) { background: #FFFFFF !important; } /* client marks stay full-colour on white */

/* the eyebrow pill (centred single-pill headers) */
html[data-theme="ar"] .nd-plane .nd-eyebrow { background: #1F1F26 !important; color: #FFFFFF !important; border: 1px solid rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-plane .nd-eyebrow::before { background: #FFF83F !important; }

/* ---------- buttons: the amber call pill ---------- */
html[data-theme="ar"] .nd-btn, html[data-theme="ar"] .nd-nav .nd-btn, html[data-theme="ar"] .nd-nav-sheet .nd-btn {
  background: #FFF83F !important; color: #0B0E14 !important; border: 0 !important; border-radius: 999px !important; }
html[data-theme="ar"] .nd-btn:hover, html[data-theme="ar"] .nd-nav .nd-btn:hover { background: #FFFA7A !important; color: #0B0E14 !important; }
html[data-theme="ar"] .nd-btn::after, html[data-theme="ar"] .nd-nav .nd-btn::after { background: #0B0E14 !important; }
html[data-theme="ar"] .nd-btn--outline { background: transparent !important; color: #FFFFFF !important; border: 1px solid rgba(255,255,255,.28) !important; }
html[data-theme="ar"] .nd-btn--outline:hover { background: rgba(255,255,255,.08) !important; }
html[data-theme="ar"] .nd-btn--text { background: transparent !important; color: #FFFFFF !important; }

/* ---------- nav + footer (global, not just the home) ---------- */
html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar {
  background: rgba(10,10,13,.82) !important; backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255,255,255,.08) !important; }
html[data-theme="ar"] .nd-nav, html[data-theme="ar"] .nd-nav .nd-wordmark, html[data-theme="ar"] .nd-nav .nd-lockup, html[data-theme="ar"] .nd-nav-brand { color: #FFFFFF !important; }
html[data-theme="ar"] .nd-nav-links a { color: #D7DAE1 !important; }
html[data-theme="ar"] .nd-nav-links a:hover, html[data-theme="ar"] .nd-nav-links a[aria-current="page"] { color: #FFFFFF !important; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-nav-link[aria-current] { color: #FFFFFF !important; text-decoration-color: #FFF83F !important; }
html[data-theme="ar"] .nd-nav-sheet { background: #0A0A0D !important; color: #FFFFFF; }
html[data-theme="ar"] .nd-nav-sheet li a { color: #FFFFFF !important; }
html[data-theme="ar"] .nd-ft { background: #0A0A0D !important; color: #D7DAE1 !important; border-top: 1px solid rgba(255,255,255,.08); }
html[data-theme="ar"] .nd-ft a, html[data-theme="ar"] .nd-ft p, html[data-theme="ar"] .nd-ft li, html[data-theme="ar"] .nd-ft span { color: #D7DAE1 !important; }
html[data-theme="ar"] .nd-ft h3, html[data-theme="ar"] .nd-ft h4, html[data-theme="ar"] .nd-ft strong, html[data-theme="ar"] .nd-ft .nd-wordmark { color: #FFFFFF !important; }

/* ---------- page heroes: dark with arounda's blue glow bottom-left ---------- */
html[data-theme="ar"] .nd-plane .nd-phero, html[data-theme="ar"] .nd-plane section.hp-hero, html[data-theme="ar"] .nd-plane .nd-phero:has(+ .nd-band-grey) {
  background: #0A0A0D !important; position: relative; overflow: hidden; }
html[data-theme="ar"] .nd-plane .nd-phero::before, html[data-theme="ar"] .nd-plane section.hp-hero::before {
  content: ""; position: absolute; left: -26vw; bottom: -40vh; width: 110vw; height: 110vh; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(closest-side, rgba(52,96,255,.85) 0%, rgba(31,73,230,.55) 22%, rgba(18,48,158,.22) 48%, rgba(10,10,13,0) 72%); }
html[data-theme="ar"] .nd-plane .nd-phero > *, html[data-theme="ar"] .nd-plane section.hp-hero > * { position: relative; z-index: 1; }
html[data-theme="ar"] .nd-plane .nd-hero-glow, html[data-theme="ar"] .nd-plane .nd-hero-dots { display: none !important; }

/* recurring glows down every inner page, like the home */
html[data-theme="ar"] .nd-plane > section { position: relative; }
html[data-theme="ar"] .nd-plane > section:nth-of-type(3n+2)::after {
  content: ""; position: absolute; right: -28vw; top: -20vh; width: 80vw; height: 90vh; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(closest-side, rgba(52,96,255,.55) 0%, rgba(31,73,230,.28) 32%, rgba(10,10,13,0) 72%); }
html[data-theme="ar"] .nd-plane > section:nth-of-type(3n)::after {
  content: ""; position: absolute; left: -28vw; bottom: -30vh; width: 80vw; height: 90vh; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(closest-side, rgba(110,61,245,.42) 0%, rgba(31,73,230,.22) 36%, rgba(10,10,13,0) 72%); }
html[data-theme="ar"] .nd-plane > section > * { position: relative; z-index: 1; }

/* ---------- things that were tinted light and now read wrong on dark ---------- */
html[data-theme="ar"] .nd-plane :is(.nd-tile, .nd-stat--sky, .nd-stat--blue, .nd-stat--violet, .nd-stat--amber) { background: #1B1B21 !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .nd-checks li::before, html[data-theme="ar"] .nd-plane .nd-faq summary::after { color: #FFF83F !important; }
html[data-theme="ar"] .nd-plane .nd-hairline, html[data-theme="ar"] .nd-plane hr { border-color: rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-plane :is(.nd-tags span, .nd-chip, .nd-tag) { background: #1F1F26 !important; color: #FFFFFF !important; border-color: rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-plane table { color: #D7DAE1; }
html[data-theme="ar"] .nd-plane :is(th, td) { border-color: rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-plane :is(input, textarea, select) { background: #141418 !important; color: #FFFFFF !important; border: 1px solid rgba(255,255,255,.14) !important; }
html[data-theme="ar"] .nd-plane :is(input, textarea)::placeholder { color: #6C7280; }
html[data-theme="ar"] ::selection { background: rgba(255,248,63,.35); color: #FFFFFF; }

/* renders keep their own white frames; the plate behind them goes dark */
html[data-theme="ar"] .nd-plane :is(.nd-hero-frame, .nd-srow__tile, .nd-bcard__plate, .nd-slab__img, .nd-case__media) { background: #141418 !important; }

@media (max-width: 640px) {
  html[data-theme="ar"] .nd-plane > section::after, html[data-theme="ar"] .nd-plane .nd-phero::before { opacity: .85; }
}
@media (prefers-reduced-motion: reduce) { html[data-theme="ar"] .nd-nav-bar { backdrop-filter: none; } }

/* =====================================================================================
   THE AROUNDA KIT — shared components for every rebuilt inner page (ArKit.tsx).
   Same values as the home's inline block so the two never fight.
   ===================================================================================== */
.ar{ --ar-ink:#FFFFFF; --ar-mute:#A3A8B3; --ar-dim:#6C7280; --ar-line:rgba(255,255,255,.12); --ar-card:#141418; --ar-card2:#1B1B21;
     --ar-chip:#1F1F26; --ar-amber:#FFF83F; --ar-amber-ink:#0B0E14; --ar-blue:#1F49E6; --ar-violet:#6E3DF5;
     --ar-display:"Inter Tight","Inter Tight Fallback",system-ui,sans-serif; --ar-serif:"Instrument Serif","Instrument Serif Fallback",Georgia,serif;
     background:#0A0A0D; color:#fff; font-family:var(--ar-display); overflow:hidden; }
.ar *{ box-sizing:border-box; }
.ar p,.ar h1,.ar h2,.ar h3,.ar h4,.ar ul,.ar ol,.ar figure,.ar blockquote,.ar dl{ margin:0; }
.ar ul,.ar ol{ padding:0; list-style:none; }
.ar a{ color:inherit; }
.ar h1,.ar h2,.ar h3,.ar h4{ font-family:var(--ar-display) !important; font-weight:500 !important; color:#fff; }
.ar .nd-container{ position:relative; z-index:1; }
.ar-sec{ position:relative; padding:clamp(60px,7.5vw,104px) 0; }
.ar-sec--tight{ padding:clamp(36px,4vw,56px) 0; }
.ar-eyebrow{ font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-mute); margin-bottom:28px; }
.ar-h{ font-family:var(--ar-display) !important; font-weight:500 !important; letter-spacing:-.03em !important; line-height:1.06; color:#fff; text-wrap:balance; }
.ar-h .ar-i,.ar .ar-i{ font-family:var(--ar-serif) !important; font-style:italic !important; font-weight:400 !important; letter-spacing:0 !important; color:inherit !important; -webkit-text-fill-color:currentColor; }
.ar-h--xl{ font-size:clamp(40px,6.4vw,84px); } .ar-h--l{ font-size:clamp(34px,4.6vw,60px); } .ar-h--m{ font-size:clamp(28px,3.4vw,44px); } .ar-h--s{ font-size:clamp(22px,2.4vw,30px); }
.ar-center{ text-align:center; }
.ar-sub{ font-size:clamp(16px,1.25vw,19px); line-height:1.5; color:var(--ar-mute); }
.ar-g{ font-family:var(--ar-display); color:var(--ar-dim); font-size:15px; letter-spacing:.02em; }
.ar-arrow{ color:#0B0E14; font-size:18px; }
.ar-stars{ color:var(--ar-amber); letter-spacing:.14em; font-size:15px; }
.ar-chip{ display:inline-flex; align-items:center; height:38px; padding:0 16px; border-radius:999px; background:var(--ar-chip); color:#fff !important; font-size:14px; font-weight:500; text-decoration:none; white-space:nowrap; border:1px solid transparent; }
a.ar-chip:hover,button.ar-chip:hover{ background:#2A2A33; }
button.ar-chip{ cursor:pointer; font-family:inherit; }
.ar-chip.is-on{ background:var(--ar-amber); color:#0B0E14 !important; }
.ar-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.ar-call{ display:inline-flex; align-items:stretch; height:60px; }
.ar-call__arrow{ display:inline-flex; align-items:center; justify-content:center; width:60px; border-radius:999px 0 0 999px; background:var(--ar-amber); color:var(--ar-amber-ink) !important; font-size:22px; text-decoration:none; margin-right:4px; transition:transform .18s ease; }
.ar-call__main{ display:inline-flex; align-items:center; padding:0 30px; border-radius:999px; background:var(--ar-amber); color:var(--ar-amber-ink) !important; font-weight:600; font-size:17px; text-decoration:none; transition:background .18s ease; border:0; font-family:inherit; cursor:pointer; }
.ar-call:hover .ar-call__main{ background:#FFFA7A; } .ar-call:hover .ar-call__arrow{ transform:translate(3px,3px); }
.ar-ghost{ display:inline-flex; align-items:center; height:60px; padding:0 28px; border-radius:999px; border:1px solid rgba(255,255,255,.28); color:#fff !important; font-weight:600; font-size:16px; text-decoration:none; }
.ar-ghost:hover{ background:rgba(255,255,255,.08); }
.ar-link{ font-weight:600; text-decoration:none; color:#fff !important; border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:3px; }
.ar-link:hover{ border-bottom-color:#fff; }

/* glows */
.ar-sec::before,.ar-sec::after{ content:""; position:absolute; border-radius:50%; pointer-events:none; z-index:0; display:none; }
.ar-glow-l::before{ display:block; left:-28vw; bottom:-36vh; width:100vw; height:100vh; background:radial-gradient(closest-side, rgba(52,96,255,.85) 0%, rgba(31,73,230,.5) 24%, rgba(18,48,158,.2) 50%, rgba(10,10,13,0) 72%); }
.ar-glow-r::before{ display:block; right:-26vw; top:-30vh; width:92vw; height:100vh; background:radial-gradient(closest-side, rgba(52,96,255,.8) 0%, rgba(31,73,230,.45) 28%, rgba(10,10,13,0) 72%); }
.ar-glow-v::after{ display:block; left:-20vw; bottom:-30vh; width:80vw; height:90vh; background:radial-gradient(closest-side, rgba(110,61,245,.42) 0%, rgba(31,73,230,.22) 36%, rgba(10,10,13,0) 72%); }

/* hero (inner pages) */
.ar-ph{ padding:clamp(48px,6vw,88px) 0 0; }
.ar-ph__crumbs{ display:flex; gap:10px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ar-dim); margin-bottom:26px; }
.ar-ph__crumbs a{ text-decoration:none; color:var(--ar-dim); } .ar-ph__crumbs a:hover{ color:#fff; }
.ar-ph__grid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(32px,5vw,72px); align-items:center; }
.ar-ph__grid--center{ grid-template-columns:1fr; text-align:center; }
.ar-ph__grid--center .ar-sub,.ar-ph__grid--center .ar-chips,.ar-ph__grid--center .ar-ph__acts{ margin-left:auto; margin-right:auto; justify-content:center; }
.ar-ph .ar-sub{ margin-top:22px; max-width:54ch; }
.ar-ph .ar-chips{ margin-top:22px; }
.ar-ph__acts{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; margin-top:30px; }
.ar-ph__clutch{ display:inline-flex; align-items:center; gap:8px; font-size:14px; color:var(--ar-mute); text-decoration:none; }
.ar-ph__clutch b{ color:#fff; }
.ar-ph__media{ border-radius:26px; background:linear-gradient(160deg,#1B1B21,#0F0F13); padding:clamp(14px,2vw,26px); }
.ar-ph__media img{ display:block; width:100%; height:auto; border-radius:14px; }
.ar-ph__stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:clamp(40px,5vw,64px); padding-top:28px; border-top:1px solid var(--ar-line); }
.ar-ph__stats b{ display:block; font-size:clamp(34px,3.6vw,52px); font-weight:500; letter-spacing:-.03em; line-height:1; }
.ar-ph__stats span{ display:block; margin-top:8px; font-size:14px; color:var(--ar-mute); }

/* logo strip + grid */
.ar-logos{ margin-top:clamp(44px,6vw,72px); border:1px solid var(--ar-line); border-radius:22px; padding:30px 36px 34px; }
.ar-logos__t{ text-align:center; font-size:14px; color:var(--ar-mute); margin-bottom:26px; }
.ar-logos__row{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; align-items:center; }
.ar-logos__row span{ display:flex; align-items:center; justify-content:center; height:68px; padding:12px 18px; border-radius:14px; background:#fff; }
.ar-logos__row img{ display:block; max-width:100%; max-height:36px; width:auto; object-fit:contain; }
.ar-lgrid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-top:clamp(36px,5vw,56px); }
.ar-lgrid div{ display:flex; align-items:center; justify-content:center; height:96px; border-radius:18px; background:#fff; padding:14px 20px; }
.ar-lgrid img{ max-height:34px; max-width:80%; width:auto; }

/* cards */
.ar-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:clamp(36px,5vw,56px); }
.ar-cards--4{ grid-template-columns:repeat(4,minmax(0,1fr)); } .ar-cards--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.ar-card{ background:var(--ar-card); border:1px solid rgba(255,255,255,.08); border-radius:22px; padding:28px; text-decoration:none; display:block; }
.ar-card--white{ background:#fff; color:#0B0E14; } .ar-card--white h3,.ar-card--white p,.ar-card--white b{ color:#0B0E14 !important; }
.ar-card .ar-g{ display:block; margin-bottom:16px; }
.ar-card h3{ font-size:22px; letter-spacing:-.02em; line-height:1.25; }
.ar-card p{ margin-top:10px; font-size:15px; line-height:1.55; color:var(--ar-mute); }
.ar-card b.ar-card__n{ display:block; font-size:clamp(34px,3.4vw,48px); font-weight:500; letter-spacing:-.03em; line-height:1; margin-bottom:10px; }
.ar-card .ar-link{ display:inline-block; margin-top:18px; }
a.ar-card:hover{ border-color:rgba(255,255,255,.22); }

/* hairline checklist + chip rows */
.ar-list li{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:20px; align-items:center; padding:22px 0; border-bottom:1px solid var(--ar-line); font-size:clamp(17px,1.4vw,21px); font-weight:500; }
.ar-list--sm li{ padding:16px 0; font-size:16px; }
.ar-row{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 0; border-bottom:1px solid var(--ar-line); }
.ar-row b{ font-size:clamp(20px,2vw,28px); font-weight:500; letter-spacing:-.02em; color:#C9CCD3; }
.ar-row .ar-chips{ justify-content:flex-end; }
.ar-split{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr); gap:clamp(32px,6vw,96px); align-items:start; margin-top:clamp(40px,5vw,64px); }
.ar-split__media{ border-radius:24px; overflow:hidden; background:var(--ar-card); padding:clamp(16px,2vw,28px); position:sticky; top:96px; }
.ar-split__media img{ display:block; width:100%; height:auto; border-radius:12px; }

/* process */
.ar-proc{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:clamp(36px,5vw,56px); }
.ar-proc div{ padding-top:18px; border-top:1px solid var(--ar-line); }
.ar-proc small{ display:block; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ar-dim); }
.ar-proc h3{ margin-top:10px; font-size:20px; letter-spacing:-.02em; }
.ar-proc em{ display:block; font-style:normal; margin-top:4px; font-size:13px; color:var(--ar-amber); }
.ar-proc p{ margin-top:10px; font-size:15px; line-height:1.55; color:var(--ar-mute); }

/* cases (same as home) */
.ar-case{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(32px,6vw,110px); align-items:center; padding:clamp(40px,5vw,72px) 0; }
.ar-case:nth-child(even){ direction:rtl; } .ar-case:nth-child(even) > *{ direction:ltr; }
.ar-case__h{ font-size:clamp(26px,2.6vw,36px); line-height:1.2; letter-spacing:-.02em; margin-top:26px; }
.ar-case__p{ margin-top:16px; font-size:16px; line-height:1.55; color:var(--ar-mute); }
.ar-case__meta{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:22px; padding-top:22px; border-top:1px solid var(--ar-line); font-size:14px; }
.ar-case__meta b{ display:block; color:var(--ar-mute); font-weight:500; margin-bottom:4px; }
.ar-case__quote{ margin-top:22px; padding-top:22px; border-top:1px solid var(--ar-line); }
.ar-case__quote p{ margin-top:12px; font-size:16px; line-height:1.55; color:#E4E6EB; }
.ar-case__quote cite{ display:block; margin-top:12px; font-style:normal; font-size:14px; color:var(--ar-mute); }
.ar-plate{ border-radius:28px; background:linear-gradient(160deg,#1B1B21,#0F0F13); padding:clamp(18px,2.4vw,34px); }
.ar-plate img{ display:block; width:100%; height:auto; border-radius:14px; }

/* works grid */
.ar-works{ display:grid; grid-template-columns:260px minmax(0,1fr); gap:clamp(28px,4vw,56px); align-items:start; margin-top:clamp(36px,5vw,56px); }
.ar-works__side{ position:sticky; top:96px; }
.ar-works__side h4{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-dim); margin:22px 0 12px; }
.ar-works__side h4:first-child{ margin-top:0; }
.ar-works__side .ar-call{ margin-top:28px; }
.ar-wgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.ar-wcard{ display:block; text-decoration:none; }
.ar-wcard figure{ border-radius:22px; overflow:hidden; background:linear-gradient(160deg,#1B1B21,#0F0F13); padding:clamp(14px,1.8vw,22px); }
.ar-wcard img{ display:block; width:100%; height:auto; border-radius:12px; }
.ar-wcard h3{ margin-top:18px; font-size:22px; letter-spacing:-.02em; }
.ar-wcard p{ margin-top:6px; font-size:15px; color:var(--ar-mute); line-height:1.5; }
.ar-wcard .ar-chips{ margin-top:12px; }
.ar-wcard .ar-chip{ height:30px; font-size:12px; padding:0 12px; }

/* amber quote, badges, cta */
.ar-quote{ border-radius:30px; background:var(--ar-amber); color:#0B0E14; padding:clamp(28px,3.4vw,44px); display:flex; flex-direction:column; justify-content:space-between; min-height:340px; margin-top:clamp(36px,5vw,56px); }
.ar-quote p{ font-size:clamp(24px,2.7vw,38px); line-height:1.18; letter-spacing:-.02em; font-weight:500; color:#0B0E14; }
.ar-quote__foot{ display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:34px; padding-top:22px; border-top:1px solid rgba(11,14,20,.18); }
.ar-quote__foot cite{ font-style:normal; font-size:15px; color:#0B0E14; }
.ar-quote__foot cite b{ display:block; font-family:var(--ar-serif); font-style:italic; font-weight:400; font-size:24px; }
.ar-quote__score{ display:flex; align-items:center; gap:12px; font-size:44px; font-weight:500; letter-spacing:-.03em; color:#0B0E14; }
.ar-quote__score small{ font-size:13px; font-weight:600; line-height:1.2; } .ar-quote__score small .ar-stars{ display:block; color:#0B0E14; font-size:11px; letter-spacing:.1em; }
.ar-badges{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; max-width:640px; margin:clamp(40px,5vw,64px) auto 0; }
.ar-badge{ text-align:center; text-decoration:none; } .ar-badge b{ display:block; font-size:28px; font-weight:500; letter-spacing:-.02em; } .ar-badge span{ display:block; margin-top:8px; font-size:14px; color:var(--ar-mute); line-height:1.4; }
.ar-cta{ position:relative; border-radius:34px; overflow:hidden; padding:clamp(56px,7vw,96px) 24px; text-align:center; color:#0B0E14; background:radial-gradient(120% 140% at 0% 0%, #1F49E6 0%, #6E3DF5 42%, #F4EFFF 78%, #FFFFFF 100%); }
.ar-cta--white{ background:#fff; }
.ar-cta .ar-h{ color:#0B0E14 !important; } .ar-cta .ar-sub{ color:#2B2F3A; margin:20px auto 0; max-width:48ch; } .ar-cta .ar-call{ margin-top:34px; }

/* faq */
.ar-faq{ margin-top:clamp(36px,5vw,56px); }
.ar-faq details{ background:var(--ar-card); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:0 24px; margin-bottom:10px; }
.ar-faq summary{ cursor:pointer; list-style:none; display:flex; align-items:center; gap:14px; padding:22px 0; font-size:17px; font-weight:500; color:#fff; }
.ar-faq summary::-webkit-details-marker{ display:none; }
.ar-faq summary::before{ content:"›"; font-size:22px; color:var(--ar-amber); transition:transform .18s ease; }
.ar-faq details[open] summary::before{ transform:rotate(90deg); }
.ar-faq details p{ padding:0 0 22px 36px; font-size:15px; line-height:1.6; color:var(--ar-mute); }

/* blog */
.ar-blog{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:clamp(36px,5vw,56px); }
.ar-post{ display:block; text-decoration:none; border-radius:22px; overflow:hidden; background:var(--ar-card); border:1px solid rgba(255,255,255,.06); }
.ar-post img{ display:block; width:100%; aspect-ratio:16/10; object-fit:cover; }
.ar-post div{ padding:22px 22px 26px; }
.ar-post b{ display:block; font-size:12px; color:var(--ar-mute); font-weight:500; letter-spacing:.04em; text-transform:uppercase; }
.ar-post h3{ margin-top:10px; font-size:19px; line-height:1.3; letter-spacing:-.01em; }
.ar-post:hover h3{ text-decoration:underline; text-underline-offset:4px; }
.ar-post__by{ display:flex; align-items:center; gap:10px; margin-top:14px; font-size:13px; color:var(--ar-mute); }
.ar-post__by img{ width:28px; height:28px; border-radius:50%; aspect-ratio:1; object-fit:cover; }
.ar-pager{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:36px; }
.ar-pager a,.ar-pager span{ display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; padding:0 14px; border-radius:999px; background:var(--ar-chip); text-decoration:none; font-size:14px; color:#fff !important; }
.ar-pager [aria-current]{ background:var(--ar-amber); color:#0B0E14 !important; }

/* post page */
.ar-art{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(32px,5vw,72px); align-items:start; margin-top:clamp(36px,5vw,56px); }
.ar-toc{ position:sticky; top:96px; background:var(--ar-card); border:1px solid rgba(255,255,255,.08); border-radius:20px; padding:22px; }
.ar-toc h4{ font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--ar-dim); margin-bottom:12px; }
.ar-toc a{ display:block; padding:7px 0; font-size:14px; color:#D7DAE1; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.06); }
.ar-toc a:hover{ color:#fff; }
.ar-toc .ar-call{ margin-top:18px; width:100%; } .ar-toc .ar-call__main{ flex:1; justify-content:center; }
.ar-byline{ display:flex; align-items:center; gap:14px; margin-top:26px; }
.ar-byline img{ width:48px; height:48px; border-radius:50%; object-fit:cover; }
.ar-byline b{ display:block; font-size:15px; } .ar-byline span{ display:block; font-size:13px; color:var(--ar-mute); }
/* article body inherits the journal's own prose styles via .nd-plane; ar-theme darkens them */
.ar .nd-plane{ background:transparent !important; }

/* contact */
.ar-contact{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:16px; margin-top:clamp(28px,4vw,48px); }
.ar-contact__side{ background:var(--ar-card); border:1px solid rgba(255,255,255,.08); border-radius:26px; padding:clamp(24px,3vw,40px); display:flex; flex-direction:column; gap:22px; }
.ar-contact__side .ar-list--sm li{ font-size:15px; padding:12px 0; grid-template-columns:28px minmax(0,1fr); }
.ar-contact__side .ar-list--sm li::before{ content:"✓"; color:var(--ar-amber); font-weight:700; }
.ar-form{ background:#fff; color:#0B0E14; border-radius:26px; padding:clamp(24px,3vw,40px); }
.ar-form h2{ color:#0B0E14 !important; font-size:clamp(26px,2.6vw,36px); letter-spacing:-.02em; }
.ar-form label{ display:block; margin-top:18px; font-size:13px; font-weight:600; color:#3A4150; }
.ar-form input,.ar-form textarea{ width:100%; margin-top:8px; padding:14px 16px; border-radius:12px; border:1px solid rgba(11,14,20,.14); background:#F7F8FB !important; color:#0B0E14 !important; font:inherit; font-size:15px; }
.ar-form textarea{ min-height:120px; resize:vertical; }
.ar-form .ar-chips{ margin-top:10px; } .ar-form .ar-chip{ background:#F0F1F4; color:#0B0E14 !important; cursor:pointer; }
.ar-form .ar-chip:has(input:checked){ background:var(--ar-amber); }
.ar-form .ar-chip input{ position:absolute; opacity:0; width:0; height:0; margin:0; }
.ar-form .ar-call{ margin-top:22px; }
.ar-form__ok{ margin-top:16px; font-size:14px; color:#3A4150; }
.ar-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }

@media (max-width:1024px){
  .ar-ph__grid,.ar-split,.ar-case,.ar-art,.ar-contact{ grid-template-columns:1fr; }
  .ar-case:nth-child(even){ direction:ltr; }
  .ar-split__media,.ar-toc,.ar-works__side{ position:static; }
  .ar-cards,.ar-cards--4,.ar-blog,.ar-proc{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ar-lgrid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ar-logos__row{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .ar-works{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .ar-cards,.ar-cards--4,.ar-cards--2,.ar-blog,.ar-proc,.ar-wgrid,.ar-form__row,.ar-ph__stats{ grid-template-columns:1fr; }
  .ar-lgrid,.ar-logos__row,.ar-badges{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ar-row{ flex-direction:column; align-items:flex-start; gap:12px; } .ar-row .ar-chips{ justify-content:flex-start; }
  .ar-call{ width:100%; } .ar-call__main{ flex:1; justify-content:center; }
  .ar-logos{ padding:22px 18px 24px; }
  .ar-quote{ min-height:0; } .ar-quote__foot{ flex-direction:column; align-items:flex-start; }
}

/* ---------- scroll motion for case rows (arounda's stacking deck; founder 2026-10-30) ----------
   Each case is sticky 14px lower than the one before, so the next slides up over it as you scroll;
   JS writes --p (0 -> 1 = how far the next card has covered this one) and .is-in on arrival.
   Transform and opacity only — never filter:blur() (speed pass rule). Static under 768px. */
.ar-stack{ position:relative; --ar-nav:64px; }
.ar-stack .ar-case{ background:#0A0A0D; border-top:1px solid rgba(255,255,255,.08); will-change:transform,opacity;
  opacity:0; transform:translateY(28px); transition:opacity .55s ease, transform .55s ease; }
.ar-stack .ar-case.is-in{ opacity:1; transform:translateY(0); }
@media (min-width:768px){
  .ar-stack .ar-case{ position:sticky; top:calc(var(--ar-nav) + 20px + var(--i,0) * 14px); z-index:calc(1 + var(--i,0));
    transform:translateY(28px) scale(1); transform-origin:50% 0; }
  .ar-stack .ar-case.is-in{ transform:translateY(0) scale(calc(1 - .06 * var(--p,0))); opacity:calc(1 - .55 * var(--p,0)); transition:opacity .55s ease, transform .55s ease; }
  .ar-stack .ar-case.is-in.is-live{ transition:none; }
}
.ar-stack__nav{ display:flex; gap:10px; margin-top:8px; }
.ar-stack__nav button{ width:52px; height:52px; border-radius:50%; border:1px solid rgba(255,255,255,.14); background:#141418; color:#fff; font-size:20px; cursor:pointer; font-family:inherit; }
.ar-stack__nav button:hover{ background:#1F1F26; }
@media (prefers-reduced-motion:reduce){ .ar-stack .ar-case{ position:static !important; opacity:1 !important; transform:none !important; transition:none !important; } }

/* ---------- fixes from the founder's screenshots (2026-10-30) ----------
   The deep guide's cards/tables and the compare table kept white backgrounds while the theme
   lightened their text -> near-invisible. They go dark like everything else (arounda's own
   comparison table is dark). The compare rules are inline (.nd-plane .ct-*), so these carry
   the theme prefix + !important to win. */
html[data-theme="ar"] .nd-plane :is(.nd-deep__item, .nd-tblwrap, .nd-deep__table, .ct-wrap) {
  background: #141418 !important; border: 1px solid rgba(255,255,255,.1) !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane :is(.nd-deep__item, .nd-tblwrap) :is(p, li, span, td, th, b, strong, h3, h4) { color: #E4E6EB !important; }
html[data-theme="ar"] .nd-plane :is(.nd-deep__item, .nd-tblwrap) :is(h3, h4, strong, b) { color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .nd-deep__table :is(th, td), html[data-theme="ar"] .nd-plane .ct-table :is(th, td) { border-color: rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-plane .ct-table thead th { background: #1B1B21 !important; color: #A3A8B3 !important; }
html[data-theme="ar"] .nd-plane .ct-table tbody th { background: #141418 !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .ct-table td { color: #D7DAE1 !important; }
html[data-theme="ar"] .nd-plane .ct-table .is-us { background: rgba(31,73,230,.22) !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .ct-table thead .is-us { background: #1F49E6 !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .nd-deep__table thead th { background: #1B1B21 !important; color: #A3A8B3 !important; }
html[data-theme="ar"] .nd-plane .nd-deep__table .is-us, html[data-theme="ar"] .nd-plane .nd-deep__table th.is-us { background: rgba(31,73,230,.22) !important; color: #FFFFFF !important; }
html[data-theme="ar"] .nd-plane .ct-note, html[data-theme="ar"] .nd-plane .ct-note a { color: #D7DAE1 !important; }
html[data-theme="ar"] .nd-plane .nd-checks li { color: #E4E6EB !important; }

/* ---------- one touch from onairdigital.in (founder 2026-10-30: "some design from this, don't be much") ----------
   Their work cards carry a small hairline spec table under the render. Ours: Industry · Country · Scope · Role. */
.ar-wcard__spec{ display:grid; grid-template-columns:110px minmax(0,1fr); gap:0 16px; margin-top:16px; border-top:1px solid var(--ar-line); font-size:13px; }
.ar-wcard__spec dt{ padding:9px 0; color:var(--ar-dim); border-bottom:1px solid rgba(255,255,255,.07); }
.ar-wcard__spec dd{ padding:9px 0; color:#E4E6EB; border-bottom:1px solid rgba(255,255,255,.07); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ---------- founder 2026-10-30: "there need gap" under the nav ----------
   The nav sits over the top of the page, so hero padding was being eaten. Add the nav height. */
html[data-theme="ar"] .ar-hero, html[data-theme="ar"] .ar-ph { padding-top: calc(var(--nd-nav-h, 64px) + clamp(56px, 7vw, 96px)) !important; }
html[data-theme="ar"] .ar-pg > .ar-sec:first-child:not(.ar-ph) { padding-top: calc(var(--nd-nav-h, 64px) + clamp(40px, 5vw, 64px)); }

/* ---------- the Services mega-menu: its panel stayed white while the theme made the labels white ---------- */
html[data-theme="ar"] .nd-mega__in { background: #141418 !important; border: 1px solid rgba(255,255,255,.12) !important; box-shadow: 0 30px 80px rgba(0,0,0,.6) !important; }
html[data-theme="ar"] .nd-mega__in * { color: #FFFFFF; }
html[data-theme="ar"] .nd-mega__in [class*="nd-mega__"] { background-color: transparent; }
html[data-theme="ar"] .nd-mega__in [class*="side"], html[data-theme="ar"] .nd-mega__in [class*="aside"], html[data-theme="ar"] .nd-mega__in [class*="more"] { background: #1B1B21 !important; }
html[data-theme="ar"] .nd-mega__in a:hover { color: #FFF83F; }
html[data-theme="ar"] .nd-mega__in small, html[data-theme="ar"] .nd-mega__in [class*="price"], html[data-theme="ar"] .nd-mega__in [class*="sub"] { color: #A3A8B3 !important; }

/* ---------- pricing: arounda's plan cards (one offer per card) on a dark panel with a group toggle ---------- */
.ar-plans { margin-top: clamp(36px,5vw,56px); border-radius: 30px; background: rgba(20,20,24,.72); border: 1px solid rgba(255,255,255,.08); padding: clamp(18px,2.4vw,32px); backdrop-filter: blur(6px); }
.ar-toggle { display: flex; justify-content: center; gap: 6px; margin-bottom: clamp(18px,2.4vw,28px); }
.ar-toggle button { height: 44px; padding: 0 20px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); background: transparent; color: #D7DAE1; font: inherit; font-weight: 500; font-size: 15px; cursor: pointer; }
.ar-toggle button.is-on { background: #FFFFFF; color: #0B0E14; border-color: #FFFFFF; }
.ar-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; align-items: start; }
.ar-plan-grid--1 { grid-template-columns: minmax(0, 720px); justify-content: center; }
.ar-plan { background: #141418; border: 1px solid rgba(255,255,255,.08); border-radius: 22px; padding: 26px 26px 10px; }
.ar-plan--pop { border-color: rgba(255,248,63,.55); }
.ar-plan__name { font-size: 22px; font-weight: 500 !important; letter-spacing: -.02em; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ar-plan__flag { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #0B0E14; background: #FFF83F; border-radius: 999px; padding: 4px 10px; }
.ar-plan__price { margin-top: 18px; font-size: clamp(32px,3.2vw,44px); font-weight: 500 !important; letter-spacing: -.03em; line-height: 1; }
.ar-plan__price small { font-size: 14px; font-weight: 500; color: #A3A8B3; margin-left: 8px; letter-spacing: 0; }
.ar-plan__scope { margin-top: 10px; font-size: 15px; line-height: 1.5; color: #A3A8B3; min-height: 44px; }
.ar-plan__alt { margin-top: 4px; font-size: 13px; color: #6C7280; }
.ar-plan .ar-pill-w { display: inline-flex; align-items: center; height: 54px; padding: 0 28px; margin-top: 22px; border-radius: 999px; background: #FFFFFF; color: #0B0E14 !important; font-weight: 600; font-size: 16px; text-decoration: none; }
.ar-plan .ar-pill-w:hover { background: #FFF83F; }
.ar-plan__sep { height: 1px; background: rgba(255,255,255,.1); margin: 26px -26px 6px; }
.ar-tick li { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 12px; align-items: start; padding: 11px 0; font-size: 15px; line-height: 1.45; color: #E4E6EB; }
.ar-tick li::before { content: "✓"; color: #FFF83F; font-weight: 700; font-size: 14px; line-height: 1.5; }
.ar-plan__note { margin: 10px 0 12px; font-size: 12.5px; color: #6C7280; line-height: 1.5; }
@media (max-width: 1024px) { .ar-plan-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ar-plan-grid, .ar-plan-grid--1 { grid-template-columns: 1fr; } .ar-toggle { flex-wrap: wrap; } .ar-plan { padding: 22px 20px 8px; } .ar-plan__sep { margin: 22px -20px 4px; } }

/* ---------- case rows, arounda's anatomy (founder 2026-10-30: "Selected work not like them") ----------
   chips -> headline -> hairline -> Clutch mark + stars -> quote -> author row with the round arrows,
   and the render on a plate with their soft grey-blue gradient. */
.ar-case__clutch { display: flex; align-items: center; gap: 14px; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--ar-line); }
.ar-case__clutch b { font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.ar-case__clutch b::after { content: "·"; color: #FF3D2E; margin-left: 2px; }
.ar-case__quote { margin-top: 14px; padding-top: 0; border-top: 0; }
.ar-case__quote p { margin-top: 0; }
.ar-case__who { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; }
.ar-case__who > div { display: flex; align-items: center; gap: 14px; }
.ar-case__who img { width: 64px; height: 64px; border-radius: 50%; object-fit: contain; background: #fff; padding: 10px; }
.ar-case__who b { display: block; font-family: var(--ar-serif) !important; font-style: italic; font-weight: 400 !important; font-size: 24px; }
.ar-case__who span { display: block; font-size: 14px; color: var(--ar-mute); margin-top: 2px; }
.ar-case__nav { display: flex; gap: 8px; }
.ar-case__nav button { width: 60px; height: 60px; border-radius: 50%; border: 0; background: #1B1B21; color: #fff; font-size: 22px; cursor: pointer; font-family: inherit; }
.ar-case__nav button:hover { background: #2A2A33; }
.ar-plate { background: radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%); }
.ar-stack__nav { display: none; }

/* ---------- font sizes: nd-system's global !important sizes were winning over the kit (founder: "font issue") ---------- */
.ar .ar-h--xl{ font-size:clamp(40px,6.4vw,84px) !important; } .ar .ar-h--l{ font-size:clamp(34px,4.6vw,60px) !important; }
.ar .ar-h--m{ font-size:clamp(28px,3.4vw,44px) !important; } .ar .ar-h--s{ font-size:clamp(22px,2.4vw,30px) !important; }
.ar .ar-sub{ font-size:clamp(16px,1.25vw,19px) !important; line-height:1.5 !important; }
.ar .ar-post h3{ font-size:19px !important; line-height:1.3 !important; font-weight:500 !important; }
.ar .ar-post b{ font-size:12px !important; } .ar .ar-post__by{ font-size:13px !important; }
.ar .ar-card h3{ font-size:22px !important; line-height:1.25 !important; } .ar .ar-card p{ font-size:15px !important; line-height:1.55 !important; }
.ar .ar-wcard h3{ font-size:22px !important; } .ar .ar-wcard p{ font-size:15px !important; }
.ar .ar-case__h{ font-size:clamp(26px,2.6vw,36px) !important; line-height:1.2 !important; } .ar .ar-case__p{ font-size:16px !important; line-height:1.55 !important; }
.ar .ar-case__quote p{ font-size:16px !important; line-height:1.55 !important; }
.ar .ar-quote p{ font-size:clamp(24px,2.7vw,38px) !important; line-height:1.18 !important; font-weight:500 !important; }
.ar .ar-quote__foot cite{ font-size:15px !important; } .ar .ar-quote__foot cite b{ font-size:24px !important; }
.ar .ar-proc h3{ font-size:20px !important; } .ar .ar-proc p{ font-size:15px !important; }
.ar .ar-plan__name{ font-size:22px !important; } .ar .ar-plan__price{ font-size:clamp(32px,3.2vw,44px) !important; line-height:1 !important; }
.ar .ar-plan__scope{ font-size:15px !important; } .ar .ar-tick li{ font-size:15px !important; } .ar .ar-list li{ font-size:clamp(17px,1.4vw,21px) !important; } .ar .ar-list--sm li{ font-size:16px !important; }
.ar .ar-row b{ font-size:clamp(20px,2vw,28px) !important; } .ar .ar-chip{ font-size:14px !important; }
.ar .ar-eyebrow{ font-size:12px !important; } .ar .ar-ph__stats b{ font-size:clamp(34px,3.6vw,52px) !important; } .ar .ar-ph__stats span{ font-size:14px !important; }
.ar .ar-toc a{ font-size:14px !important; } .ar .ar-byline b{ font-size:15px !important; } .ar .ar-byline span{ font-size:13px !important; }
.ar .ar-aud__c h3{ font-size:24px !important; } .ar .ar-aud__c li{ font-size:15px !important; }
.ar .ar-founder__p{ font-size:clamp(20px,1.8vw,26px) !important; }

/* ---------- /work/<slug> (CaseFile + FounderCta): every white or pale surface goes dark (founder: "insane", 2026-10-30) ---------- */
html[data-theme="ar"] .nd-pg-work .cf-ledger{ background:rgba(255,255,255,.05) !important; border-color:rgba(255,255,255,.12) !important; box-shadow:none !important; }
html[data-theme="ar"] .nd-pg-work .cf-ledger *{ color:#FFFFFF; }
html[data-theme="ar"] .nd-pg-work .cf-ledger dt, html[data-theme="ar"] .nd-pg-work .cf-ledger small, html[data-theme="ar"] .nd-pg-work .cf-ledger span{ color:rgba(255,255,255,.62); }
html[data-theme="ar"] .nd-pg-work .cf-ledger a{ color:#8FB0FF !important; }
html[data-theme="ar"] .nd-pg-work .cf-hero .nd-hero-frame, html[data-theme="ar"] .nd-pg-work .cf-shot__frame, html[data-theme="ar"] .nd-pg-work .cf-wall__item, html[data-theme="ar"] .nd-pg-work .cf-next__img{ background:#15161C !important; border-color:rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-pg-work .cf-wall__bar{ background:#1C1E26 !important; border-color:rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-pg-work .cf-tl__n{ background:#15161C !important; color:#FFFFFF !important; border-color:rgba(255,255,255,.18) !important; box-shadow:0 0 0 4px #0B0B0F !important; }
html[data-theme="ar"] .nd-pg-work .cf-ch__t, html[data-theme="ar"] .nd-pg-work .cf-type__aa, html[data-theme="ar"] .nd-pg-work .cf-type__s{ color:#FFFFFF !important; }
html[data-theme="ar"] .nd-pg-work .cf-ch__p, html[data-theme="ar"] .nd-pg-work .cf-pal__hex{ color:rgba(255,255,255,.72) !important; }
html[data-theme="ar"] .nd-pg-work .cf-pal__role, html[data-theme="ar"] .nd-pg-work .cf-type__meta{ color:rgba(255,255,255,.58) !important; border-color:rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-pg-work .cf-ch__n, html[data-theme="ar"] .nd-pg-work .cf-shot__n, html[data-theme="ar"] .nd-pg-work .cf-dec__n, html[data-theme="ar"] .nd-pg-work .cf-next__k{ color:#8FB0FF !important; }
/* the design-system cards (palette swatches + "Aa" type cards) */
html[data-theme="ar"] .nd-pg-work .cf-pal li, html[data-theme="ar"] .nd-pg-work .cf-type li{ background:#15161C !important; border-color:rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-pg-work .cf-pal__sw{ border-color:rgba(255,255,255,.1) !important; }
/* "Next case study" */
html[data-theme="ar"] .nd-pg-work .cf-next__panel{ background:radial-gradient(120% 90% at 20% 0%, #232A48 0%, #171A26 45%, #0F1117 100%) !important; border-color:rgba(255,255,255,.12) !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-pg-work .cf-next__panel *{ color:#FFFFFF; }
html[data-theme="ar"] .nd-pg-work .cf-next__k{ color:#FFF83F !important; }
html[data-theme="ar"] .nd-pg-work .cf-next__more{ color:#FFF83F !important; }
/* the lightbox stays a light panel (it holds screenshots), only the chrome is tinted */
html[data-theme="ar"] .cf-lb__panel{ background:#15161C !important; } html[data-theme="ar"] .cf-lb__tabs button:hover, html[data-theme="ar"] .cf-lb__dev{ background:rgba(255,255,255,.08) !important; }
html[data-theme="ar"] .cf-lb__dev button[aria-pressed="true"]{ background:#FFFFFF !important; color:#0B0B0F !important; }
/* FounderCta: the white form card */
html[data-theme="ar"] .nd-plane .fc-form{ background:#15161C !important; color:#FFFFFF !important; border:1px solid rgba(255,255,255,.12); box-shadow:none !important; }
html[data-theme="ar"] .nd-plane .fc-form h3{ color:#FFFFFF !important; } html[data-theme="ar"] .nd-plane .fc-form > p, html[data-theme="ar"] .nd-plane .fc-note{ color:rgba(255,255,255,.62) !important; }
html[data-theme="ar"] .nd-plane .fc-label{ color:rgba(255,255,255,.82) !important; }
html[data-theme="ar"] .nd-plane input.fc-input, html[data-theme="ar"] .nd-plane textarea.fc-input{ background:#0F1016 !important; color:#FFFFFF !important; border-color:rgba(255,255,255,.16) !important; }
html[data-theme="ar"] .nd-plane .fc-input::placeholder{ color:rgba(255,255,255,.42) !important; }
html[data-theme="ar"] .nd-plane .fc-input:focus{ border-color:#FFF83F !important; box-shadow:0 0 0 3px rgba(255,248,63,.22) !important; }
html[data-theme="ar"] .nd-plane .fc-chip span{ background:#0F1016 !important; color:#FFFFFF !important; border-color:rgba(255,255,255,.16) !important; }
html[data-theme="ar"] .nd-plane .fc-chip input:checked + span{ background:#FFF83F !important; color:#0B0B0F !important; border-color:#FFF83F !important; }
html[data-theme="ar"] .nd-plane .fc-form .nd-btn{ background:#FFF83F !important; color:#0B0B0F !important; border-color:#FFF83F !important; }
html[data-theme="ar"] .nd-plane .fc-panel{ background:radial-gradient(120% 90% at 0% 0%, #2B3BB8 0%, #1B2460 45%, #0F1117 100%) !important; }

/* ---------- founder round "insane" #2 (2026-10-30): white services card headings, compare highlight column, footer line + button ---------- */
.ar .ar-svc, .ar .ar-svc h3, .ar .ar-svc__col h3, .ar .ar-svc__col a{ color:#0B0E14 !important; }
.ar .ar-svc__col a:hover{ color:#1F49E6 !important; }
.ar .ar-svc__col h3{ font-size:28px !important; }
html[data-theme="ar"] .nd-deep .is-hi, html[data-theme="ar"] .nd-deep td.is-hi{ background:rgba(31,73,230,.22) !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-deep thead .is-hi, html[data-theme="ar"] .nd-deep th.is-hi{ background:#1F49E6 !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-ft{ margin:0 !important; border-radius:0 !important; border-top:0 !important; }
html[data-theme="ar"] .nd-ft .nd-btn, html[data-theme="ar"] .nd-ft .nd-btn span{ background:#FFF83F !important; color:#0B0E14 !important; }
html[data-theme="ar"] .nd-ft .nd-btn:hover{ background:#FFFA7A !important; }

/* ---------- arounda's home-reviews case block (2026-10-30): sticky text, tall image column ---------- */
.ar-stack{ position:relative; display:flex; flex-direction:column; gap:clamp(64px,8vw,100px); margin-top:clamp(40px,5vw,64px); }
.ar-stack .ar-case{ position:relative; display:flex; align-items:flex-start; gap:clamp(32px,5.5vw,88px); padding:0; background:transparent; border:0; opacity:1; transform:none; direction:ltr; will-change:auto; }
.ar-stack .ar-case:nth-child(even){ direction:ltr; }
.ar-stack .ar-case__text{ position:sticky; top:calc(var(--nd-nav-h,64px) + 40px); flex:none; width:100%; max-width:405px; }
.ar-stack .ar-case__media{ display:flex; flex-direction:column; gap:10px; flex:1 1 auto; min-width:0; text-decoration:none; }
.ar-stack .ar-plate{ display:block; position:relative; min-height:clamp(380px,46vw,516px); border-radius:48px; overflow:hidden; background:var(--plate, radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%)); }
.ar-stack .ar-plate img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:35% 50%; display:block; transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.ar-stack .ar-case__media:hover .ar-plate img{ transform:scale(1.03); }
.ar-stack .ar-case__h{ margin-top:0 !important; padding-bottom:22px; border-bottom:1px solid rgba(255,255,255,.12); font-size:clamp(24px,2.4vw,32px) !important; }
.ar-stack .ar-chips{ margin-bottom:40px; }
.ar-stack .ar-case__clutch{ margin-top:22px; padding-top:0; border-top:0; }
.ar-stack .ar-case__quote p{ max-width:460px; color:rgba(255,255,255,.9) !important; }
.ar-stack .ar-case__p{ margin-top:22px; max-width:460px; }
.ar-stack .ar-case__who{ margin-top:26px; }
.ar-stack .ar-case__nav button[disabled]{ opacity:.35; cursor:default; }
.ar-stack .ar-case__more{ display:inline-block; margin-top:22px; }
.ar-stack__more{ display:flex; justify-content:center; margin-top:clamp(24px,3vw,40px); }
@media (max-width:1024px){ .ar-stack .ar-case__text{ max-width:340px; } }
@media (max-width:767px){
  .ar-stack{ gap:56px; }
  .ar-stack .ar-case{ flex-direction:column; gap:20px; }
  .ar-stack .ar-case__text{ position:static; max-width:none; }
  .ar-stack .ar-plate{ min-height:0; aspect-ratio:1.15; border-radius:24px; }
  .ar-stack .ar-plate + .ar-plate{ display:none; }
}
@media (prefers-reduced-motion:reduce){ .ar-stack .ar-case__text{ position:static; } }

/* ---------- reveals (arounda's GSAP fade-ups, as a class the observer adds) ---------- */
html.ar-js .ar-pg .ar-sec > .nd-container > *, html.ar-js .ar-pg .ar-case, html.ar-js .ar-pg .ar-hero .nd-container > *{ opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
html.ar-js .ar-pg .ar-sec > .nd-container > .is-rev, html.ar-js .ar-pg .ar-case.is-rev, html.ar-js .ar-pg .ar-hero .nd-container > .is-rev{ opacity:1; transform:none; }
html.ar-js .ar-pg .ar-stack{ opacity:1; transform:none; }
html.lenis, html.lenis body{ height:auto; } .lenis.lenis-smooth{ scroll-behavior:auto !important; } .lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; } .lenis.lenis-stopped{ overflow:hidden; }

/* ---------- navbar like arounda: blurred transparent bar, white links, white "Contact us" pill with the black arrow circle ---------- */
html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ background:rgba(10,10,13,.55) !important; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:0 !important; box-shadow:none !important; height:72px !important; }
html[data-theme="ar"]{ --nd-nav-h:72px; }
html[data-theme="ar"] .nd-nav-links ul{ gap:32px; }
html[data-theme="ar"] .nd-nav-links a{ font-size:16px !important; font-weight:500; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-nav-links a:hover{ color:#FFF83F !important; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-nav-link[aria-current]{ color:#FFF83F !important; text-decoration:none !important; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta, html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta:hover{ display:inline-flex !important; align-items:center; gap:10px; height:44px !important; padding:0 6px 0 20px !important; background:#FFFFFF !important; color:#0B0E14 !important; font-size:15px !important; font-weight:500 !important; border-radius:999px !important; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta::after{ display:none !important; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta i{ display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#0B0E14; color:#FFFFFF; font-style:normal; font-size:14px; transition:transform .25s; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta:hover i{ transform:rotate(-45deg); }

/* ---------- 2026-10-30 round 3: FAQ founder card, timeline, about mosaic/leadership, industries hero, works tiles, halo post ---------- */
.ar-faq-wrap{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr); gap:24px; align-items:start; margin-top:clamp(36px,5vw,56px); }
.ar-faq-wrap .ar-faq{ margin-top:0; }
.ar-founder-card{ position:sticky; top:calc(var(--nd-nav-h,72px) + 24px); background:#FFFFFF; color:#0B0E14; border-radius:28px; padding:28px; }
.ar-founder-card__who{ display:flex; align-items:center; gap:14px; }
.ar-founder-card__who img{ width:56px; height:56px; border-radius:50%; object-fit:cover; }
.ar-founder-card__who b{ display:block; font-family:var(--ar-serif) !important; font-style:italic; font-weight:400 !important; font-size:22px; color:inherit; }
.ar-founder-card__who span{ display:block; font-size:13px; color:rgba(11,14,20,.55); margin-top:2px; }
.ar-founder-card > p{ margin-top:18px; font-size:15px; line-height:1.55; color:rgba(11,14,20,.78); }
.ar-founder-card .ar-call{ margin-top:22px; }
.ar-tl{ list-style:none; margin:clamp(36px,5vw,56px) 0 0; padding:40px 0 0; display:grid; grid-template-columns:repeat(var(--n,4),minmax(0,1fr)); gap:32px; position:relative; }
.ar-tl::before{ content:""; position:absolute; left:0; right:0; top:0; height:1px; background:linear-gradient(90deg,#FFF83F 0 12%,rgba(255,255,255,.18) 12%); }
.ar-tl li::before{ content:""; position:absolute; top:-5px; width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.25); }
.ar-tl li{ position:relative; }
.ar-tl li:first-child::before{ background:#FFF83F; box-shadow:0 0 0 6px rgba(255,248,63,.18); }
.ar-tl small{ display:block; font-size:13px; color:var(--ar-mute); letter-spacing:.06em; }
.ar-tl h3{ margin-top:12px !important; font-size:20px !important; }
.ar-tl p{ margin-top:10px; font-size:15px; line-height:1.55; color:var(--ar-mute); }
.ar-tl em{ display:inline-block; margin-top:14px; padding:6px 12px; border-radius:999px; background:#FFF83F; color:#0B0E14; font-style:normal; font-size:12px; font-weight:600; }
.ar-tl li:not(:first-child) em{ background:rgba(255,255,255,.08); color:#fff; }
.ar-mosaic{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ar-mosaic li a{ display:block; position:relative; border-radius:22px; overflow:hidden; background:#15161C; aspect-ratio:1; text-decoration:none; }
.ar-mosaic li img{ width:100%; height:100%; object-fit:cover; object-position:top; display:block; filter:saturate(.9); transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.ar-mosaic li a:hover img{ transform:scale(1.04); }
.ar-mosaic li span{ position:absolute; left:14px; right:14px; bottom:12px; font-size:13px; color:rgba(255,255,255,.75); text-shadow:0 1px 8px rgba(0,0,0,.6); }
.ar-mosaic li span b{ display:block; font-size:15px; color:#fff; font-weight:500; }
.ar-principles{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,80px); align-items:start; }
.ar-principles__mv{ display:grid; gap:28px; padding-top:12px; }
.ar-principles__mv small{ display:block; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-mute); }
.ar-principles__mv p{ margin-top:10px; font-size:clamp(17px,1.4vw,21px); line-height:1.45; }
.ar-model{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:clamp(36px,5vw,56px); padding-top:28px; border-top:1px solid rgba(255,255,255,.12); }
.ar-model h3{ font-size:20px !important; } .ar-model p{ margin-top:12px; font-size:15px; line-height:1.55; color:var(--ar-mute); }
.ar-lead{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; margin-top:clamp(36px,5vw,56px); align-items:start; }
.ar-lead__big{ position:relative; display:block; border-radius:28px; overflow:hidden; background:#15161C; aspect-ratio:1; text-decoration:none; }
.ar-lead__big img{ width:100%; height:100%; object-fit:cover; object-position:top; display:block; }
.ar-lead__big > span{ position:absolute; left:24px; top:22px; color:rgba(255,255,255,.75); font-size:14px; }
.ar-lead__big > span b{ display:block; font-size:24px; color:#fff; font-weight:500; }
.ar-lead__list{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ar-lead__list li{ display:grid; grid-template-columns:minmax(0,1fr) auto 120px; align-items:center; gap:16px; background:#15161C; border-radius:20px; padding:0 0 0 22px; overflow:hidden; }
.ar-lead__list li > a:first-child{ text-decoration:none; } .ar-lead__list li b{ display:block; font-size:18px; color:#fff; font-weight:500; } .ar-lead__list li > a:first-child span{ display:block; font-size:13px; color:var(--ar-mute); margin-top:2px; }
.ar-lead__in{ display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.08); color:#fff !important; text-decoration:none; font-size:13px; font-weight:600; }
.ar-lead__list li img{ width:120px; height:120px; object-fit:cover; object-position:top; display:block; }
.ar-quote-card{ align-self:center; background:#FFFFFF; color:#0B0E14; border-radius:28px; padding:28px; }
.ar-quote-card > p{ font-family:var(--ar-serif) !important; font-style:italic; font-size:clamp(20px,1.7vw,24px); line-height:1.35; }
.ar-quote-card__foot{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; margin-top:22px; }
.ar-quote-card__foot img{ width:48px; height:48px; border-radius:50%; object-fit:contain; background:#F2F2F4; padding:6px; }
.ar-quote-card__foot b{ display:block; font-family:var(--ar-serif) !important; font-style:italic; font-weight:400 !important; font-size:18px; } .ar-quote-card__foot span{ display:block; font-size:12px; color:rgba(11,14,20,.55); }
.ar-quote-card__foot strong{ font-size:20px; } .ar-quote-card__foot .ar-stars{ font-size:12px; color:#0B0E14; }
.ar-ph__actions{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:28px; }
.ar-ph__actions + .ar-ph__clutch{ display:inline-flex; margin-top:18px; }
.ar-num-list{ list-style:none; margin:0; padding:0; display:grid; gap:0; }
.ar-num-list li{ display:grid; grid-template-columns:48px minmax(0,1fr); gap:16px; padding:20px 0; border-top:1px solid rgba(255,255,255,.12); }
.ar-num-list small{ font-size:13px; color:var(--ar-mute); padding-top:3px; } .ar-num-list b{ display:block; font-size:17px; font-weight:500; color:#fff; } .ar-num-list p{ margin-top:6px; font-size:15px; line-height:1.55; color:var(--ar-mute); }
.ar-bignums{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:clamp(40px,6vw,80px); }
.ar-bignums b{ display:block; font-size:clamp(56px,7vw,112px); line-height:.95; letter-spacing:-.04em; font-weight:500; color:#fff; }
.ar-bignums span{ display:block; margin-top:14px; font-size:15px; color:var(--ar-mute); max-width:260px; }
.ar-fstats{ display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:14px; margin-top:clamp(36px,5vw,56px); }
.ar-fstats > div{ background:#15161C; border-radius:24px; padding:28px; min-height:220px; display:flex; flex-direction:column; justify-content:space-between; }
.ar-fstats > div > b{ font-size:clamp(44px,4.6vw,72px); line-height:1; letter-spacing:-.03em; font-weight:500; color:#fff; }
.ar-fstats > div > span{ font-size:15px; color:var(--ar-mute); }
.ar-fstats__founder{ background:#FFFFFF !important; color:#0B0E14; }
.ar-fstats__founder h3{ font-size:24px !important; color:#0B0E14 !important; margin:18px 0 !important; }
.ar-cat-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:clamp(36px,5vw,56px); }
.ar-cat-grid > div{ display:flex; gap:14px; align-items:flex-start; background:#15161C; border-radius:20px; padding:22px; font-size:16px; line-height:1.45; }
.ar-cat-grid .ar-g{ flex:none; }
.ar-feat{ display:block; background:#FFFFFF; border-radius:28px; padding:14px; text-decoration:none; color:#0B0E14; align-self:center; }
.ar-feat__img{ display:block; border-radius:18px; overflow:hidden; aspect-ratio:1.5; background:radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%); }
.ar-feat__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.ar-feat__cap{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 8px 4px; }
.ar-feat__cap b{ font-size:16px; font-weight:500; color:#0B0E14; } .ar-feat__cap .ar-chip{ background:#F0F0F3; color:#0B0E14; border-color:transparent; }
.ar-rail{ list-style:none; margin:0 0 26px; padding:0; display:grid; gap:2px; }
.ar-rail button{ width:100%; text-align:left; padding:10px 14px; border-radius:12px; border:0; background:transparent; color:#fff; font-family:inherit; font-size:15px; cursor:pointer; }
.ar-rail button span{ color:var(--ar-mute); } .ar-rail button:hover{ background:rgba(255,255,255,.06); } .ar-rail button.is-on{ background:#FFF83F; color:#0B0E14; } .ar-rail button.is-on span{ color:rgba(11,14,20,.6); }
.ar-wgrid--tiles{ gap:40px 24px; }
.ar-wtile{ display:block; text-decoration:none; color:#fff; }
.ar-wtile figure{ margin:0; aspect-ratio:1; border-radius:24px; overflow:hidden; background:radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%); }
.ar-wtile figure img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.ar-wtile:hover figure img{ transform:scale(1.04); }
.ar-wtile h3{ margin-top:18px !important; font-size:20px !important; } .ar-wtile p{ margin-top:6px; font-size:14px; line-height:1.5; color:var(--ar-mute); max-width:380px; }
.ar-wtile .ar-chips{ margin-top:12px; } .ar-chip--sm{ font-size:12px !important; padding:5px 10px; }
/* halo-lab article */
.hl-hero{ padding:calc(var(--nd-nav-h,72px) + 56px) 0 48px; background:radial-gradient(120% 120% at 50% -20%, #2F55FF 0%, #16236B 45%, #0A0A0D 100%); }
.hl-hero .ar-h{ max-width:18ch; margin-top:18px; }
.hl-hero__meta{ display:flex; gap:28px; margin-top:26px; padding-top:18px; border-top:1px solid rgba(255,255,255,.18); font-size:13px; color:rgba(255,255,255,.75); }
.hl-grid{ display:grid; grid-template-columns:260px minmax(0,1fr) 56px; gap:clamp(24px,4vw,64px); align-items:start; padding-top:40px; }
.hl-toc__in, .hl-rail__in{ position:sticky; top:calc(var(--nd-nav-h,72px) + 24px); }
.hl-toc h4{ font-size:12px !important; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-mute); }
.hl-toc ol{ margin:14px 0 0; padding:0 0 0 18px; display:grid; gap:10px; }
.hl-toc li{ font-size:14px; line-height:1.4; color:var(--ar-mute); } .hl-toc li a{ color:inherit; text-decoration:none; } .hl-toc li a:hover{ color:#fff; }
.hl-ask{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) 64px; align-items:center; gap:12px; margin-top:28px; padding:16px 18px; border-radius:18px; background:radial-gradient(120% 120% at 100% 0%, #3A63FF 0%, #1D2C7A 60%, #15161C 100%); }
.hl-ask b{ display:block; font-size:15px; } .hl-ask span{ font-size:13px; color:rgba(255,255,255,.7); } .hl-ask img{ width:64px; height:64px; border-radius:50%; object-fit:cover; } .hl-ask > a{ position:absolute; inset:0; }
.hl-toc .ar-call{ margin-top:16px; }
.hl-author{ display:flex; align-items:center; gap:12px; } .hl-author img{ width:48px; height:48px; border-radius:50%; object-fit:cover; }
.hl-author b{ display:block; font-size:15px; font-weight:500; } .hl-author span{ display:block; font-size:13px; color:var(--ar-mute); }
.hl-lead{ margin-top:22px !important; font-size:clamp(18px,1.5vw,22px) !important; line-height:1.45 !important; font-weight:500 !important; color:#fff !important; }
.hl-cover{ margin:28px 0 0 !important; } .hl-cover img{ width:100%; height:auto; border-radius:20px; display:block; } .hl-cover figcaption{ margin-top:10px; font-size:13px; color:var(--ar-mute); text-align:center; }
.hl-art .nd-plane{ margin-top:28px; }
.hl-rail__in{ display:grid; gap:10px; }
.hl-rail__in a{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.08); color:#fff !important; text-decoration:none; font-size:14px; font-weight:600; }
.hl-rail__in a:hover{ background:#FFF83F; color:#0B0E14 !important; }
@media (max-width:1024px){ .ar-fstats{ grid-template-columns:1fr 1fr; } .ar-cat-grid, .ar-model{ grid-template-columns:1fr 1fr; } .ar-tl{ grid-template-columns:1fr 1fr; } .hl-grid{ grid-template-columns:220px minmax(0,1fr); } .hl-rail{ display:none; } }
@media (max-width:767px){ .ar-faq-wrap, .ar-principles, .ar-lead, .ar-mosaic, .ar-model, .ar-cat-grid, .ar-bignums, .ar-fstats, .ar-tl, .hl-grid{ grid-template-columns:1fr; } .ar-mosaic{ grid-template-columns:1fr 1fr; } .ar-founder-card, .hl-toc__in{ position:static; } .ar-lead__list li{ grid-template-columns:minmax(0,1fr) auto 84px; } .ar-lead__list li img{ width:84px; height:84px; } }
/* the halo layout already carries the table of contents in its left column: hide the article's own copy */
.hl-art nav.nd-card2[aria-label="In this article"]{ display:none !important; }

/* ---------- round 4 (founder: navbar, team band, case card, pricing, blog) ---------- */
/* renders are shown WHOLE in the case plates (CLAUDE.md), never cropped: contain, on the plate's own ground */
.ar-stack .ar-plate img{ object-fit:contain !important; object-position:50% 50% !important; padding:4%; }
.ar-rows{ display:grid; gap:clamp(40px,6vw,88px); margin-top:clamp(36px,5vw,56px); }
.ar-row-case{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(28px,5vw,72px); align-items:center; }
.ar-row-case:nth-child(even) .ar-row-case__img{ order:2; }
.ar-row-case__img{ display:block; border-radius:32px; overflow:hidden; aspect-ratio:1.3; background:var(--plate, radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%)); }
.ar-row-case__img img{ width:100%; height:100%; object-fit:contain; display:block; padding:4%; transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.ar-row-case__img:hover img{ transform:scale(1.03); }
.ar-row-case__text h3{ margin-top:22px !important; font-size:clamp(26px,2.6vw,36px) !important; line-height:1.15 !important; }
.ar-row-case__text > p{ margin-top:14px; font-size:16px; line-height:1.55; color:var(--ar-mute); max-width:46ch; }
.ar-row-case__text small{ display:block; margin-top:26px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--ar-dim); }
.ar-row-case__list{ list-style:none; margin:12px 0 0; padding:0; display:grid; gap:10px; }
.ar-row-case__list li{ position:relative; padding-left:22px; font-size:15px; line-height:1.45; }
.ar-row-case__list li::before{ content:""; position:absolute; left:0; top:7px; width:9px; height:9px; border-radius:50%; background:#FFF83F; }
.ar-row-case__text .ar-pill-w{ display:inline-flex; align-items:center; height:48px; padding:0 22px; margin-top:26px; border-radius:999px; background:#fff; color:#0B0E14 !important; font-size:15px; font-weight:500; text-decoration:none; }
/* team band */
.ar-band{ display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:12px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.ar-band > *{ display:block; aspect-ratio:1; border-radius:18px; overflow:hidden; background:#111115; }
.ar-band__face img{ width:100%; height:100%; object-fit:cover; object-position:top; display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.ar-band__face:hover img{ transform:scale(1.05); }
.ar-band__empty{ background:linear-gradient(180deg,#141418,#0E0E12); }
.ar-band__face:nth-child(4n+1){ background:#D9C7FF; } .ar-band__face:nth-child(4n+3){ background:#CFE9FF; } .ar-band__face:nth-child(4n){ background:#CFF5E0; }
/* navbar sized like theirs: 24px top padding, 17px links, a 60px pill with a 44px arrow circle */
html[data-theme="ar"]{ --nd-nav-h:104px; }
html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ height:104px !important; padding-top:24px; background:transparent !important; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ background:rgba(10,10,13,.7) !important; }
html[data-theme="ar"] .nd-nav-in{ height:80px; }
html[data-theme="ar"] .nd-nav .nd-wordmark{ font-size:22px !important; }
html[data-theme="ar"] .nd-nav-links ul{ gap:40px; }
html[data-theme="ar"] .nd-nav-links a{ font-size:17px !important; font-weight:500 !important; }
html[data-theme="ar"] .nd-nav-links .nd-has-mega > a{ gap:8px; } html[data-theme="ar"] .nd-nav-chev{ width:12px; height:12px; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta, html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta:hover{ height:60px !important; padding:0 8px 0 30px !important; gap:16px; font-size:17px !important; }
html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta i{ width:44px; height:44px; font-size:18px; }
/* the dropdowns: arounda's white panels with dark text, a label per column */
html[data-theme="ar"] .nd-mega{ width:min(1040px, calc(100vw - 48px)); transform:translate(-50%,6px); }
html[data-theme="ar"] .nd-mega__in{ display:grid; grid-template-columns:repeat(var(--cols,3),minmax(0,1fr)); gap:28px; padding:28px 32px; border-radius:24px; background:#FFFFFF !important; border:0 !important; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); }
html[data-theme="ar"] .nd-mega__in *{ color:#0B0E14; }
html[data-theme="ar"] .nd-mega__col{ min-width:0; }
html[data-theme="ar"] .nd-mega__label{ display:block; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(11,14,20,.5) !important; margin-bottom:10px; }
html[data-theme="ar"] .nd-mega__list{ display:grid !important; grid-template-columns:1fr; gap:0 !important; margin:0; padding:0; list-style:none; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-mega__item{ display:flex !important; align-items:center; justify-content:space-between; gap:12px; padding:11px 0 !important; border-bottom:1px solid rgba(11,14,20,.06); border-radius:0; font-size:15px !important; font-weight:500 !important; color:#0B0E14 !important; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-mega__item:hover{ background:transparent; color:#1F49E6 !important; }
html[data-theme="ar"] .nd-mega__item small{ display:block; font-size:13px; font-weight:400; color:rgba(11,14,20,.55) !important; margin-top:2px; }
html[data-theme="ar"] .nd-mega__item .nd-mega__arrow{ flex:none; color:rgba(11,14,20,.45); font-size:14px; }
html[data-theme="ar"] .nd-mega__dot{ display:none !important; }
html[data-theme="ar"] .nd-mega__col--big .nd-mega__item{ flex-direction:column; align-items:flex-start; gap:2px; }
/* pricing list cards: amber ticks, tighter rows, equal heights */
.ar-tickrow{ display:grid; grid-template-columns:18px minmax(0,1fr); gap:10px; align-items:start; padding:7px 0 !important; font-size:14.5px; }
.ar-tickrow::before{ content:"✓"; color:#FFF83F; font-size:13px; font-weight:700; line-height:1.5; }
.ar-cards--stretch{ align-items:stretch !important; } .ar-cards--stretch > .ar-card{ display:flex; flex-direction:column; } .ar-cards--stretch > .ar-card > :last-child{ margin-top:auto !important; }
@media (max-width:1024px){ .ar-band{ grid-template-columns:repeat(4,minmax(0,1fr)); } .ar-row-case{ grid-template-columns:1fr; } .ar-row-case:nth-child(even) .ar-row-case__img{ order:0; } }
/* halo-lab journal index */
.hl-filters{ display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.hl-search{ position:relative; display:block; width:min(320px,100%); }
.hl-search input{ width:100%; height:44px; padding:0 44px 0 16px; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.04); color:#fff; font-family:inherit; font-size:14px; }
.hl-search input::placeholder{ color:rgba(255,255,255,.45); } .hl-search input:focus{ outline:none; border-color:#FFF83F; }
.hl-search span{ position:absolute; right:6px; top:6px; width:32px; height:32px; border-radius:50%; background:#fff; color:#0B0E14; display:grid; place-items:center; font-size:16px; }
.hl-cards{ margin-top:32px !important; gap:28px 20px; }
.ar-post.hl-card{ display:block; background:transparent !important; border:0 !important; padding:0 !important; }
.hl-card__img{ display:block; aspect-ratio:1.5; border-radius:20px; overflow:hidden; background:radial-gradient(120% 90% at 20% 0%, #3A4050 0%, #1F2330 45%, #0F1117 100%); }
.hl-card__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.hl-card:hover .hl-card__img img{ transform:scale(1.04); }
.hl-card__meta{ display:flex; align-items:center; gap:10px; margin-top:16px; font-size:11px !important; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-mute); }
.hl-card__meta b{ font-size:11px !important; color:var(--ar-mute); font-weight:600; } .hl-card__meta i{ font-style:normal; color:rgba(255,255,255,.25); }
.ar .hl-card h3{ margin-top:10px !important; font-size:19px !important; line-height:1.3 !important; }
.hl-pager{ justify-content:center; margin-top:40px; }
.hl-pager a, .hl-pager span[aria-current]{ width:36px; height:36px; border-radius:50%; display:inline-grid; place-items:center; }
.hl-pager span[aria-current]{ background:#FFF83F; color:#0B0E14; }
html[data-theme="ar"] .nd-nav-expand{ width:0; height:0; overflow:hidden; opacity:0; position:absolute; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-mega__all{ margin-top:10px; border-bottom:0; color:#1F49E6 !important; }
html[data-theme="ar"] .nd-mega__txt{ display:flex; flex-direction:column; gap:2px; } html[data-theme="ar"] .nd-mega__txt b{ font-size:15px; font-weight:500; }
/* case plates: the render's exact ratio, so it fills the plate whole; page shots cover from the top */
.ar-stack .ar-plate{ min-height:0 !important; aspect-ratio:1280/880; }
.ar-stack .ar-plate img{ padding:0 !important; }
.ar-stack .ar-plate.is-shot img{ object-fit:cover !important; object-position:50% 0 !important; }
.ar-stack{ gap:clamp(96px,12vw,160px) !important; }
/* about: awards as badge tiles, big results, story in numbers */
.ar-awards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:clamp(36px,5vw,56px); }
.ar-awards > a, .ar-awards > div{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; min-height:180px; padding:24px; border-radius:22px; background:#141418; border:1px solid rgba(255,255,255,.08); text-decoration:none; color:#fff; text-align:center; }
.ar-awards b{ font-size:28px; font-weight:500; letter-spacing:-.02em; } .ar-awards .ar-stars{ font-size:12px; color:#FFF83F; }
.ar-awards small{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ar-mute); max-width:18ch; line-height:1.4; }
.ar-awards i{ font-style:normal; font-size:26px; line-height:1; color:rgba(255,255,255,.55); }
.ar-story{ position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:clamp(40px,6vw,80px); }
.ar-story > div{ position:relative; }
.ar-story b{ display:block; font-size:clamp(72px,9vw,150px); line-height:.9; letter-spacing:-.05em; font-weight:500; color:#fff; }
.ar-story span{ display:block; margin-top:16px; font-size:15px; color:var(--ar-mute); }
.ar-story .ar-float{ position:absolute; top:-26px; left:40%; display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; background:#fff; color:#0B0E14; font-size:12px; font-weight:600; box-shadow:0 10px 24px -10px rgba(0,0,0,.6); transform:rotate(-6deg); }
.ar-story .ar-float img{ width:20px; height:20px; border-radius:50%; object-fit:cover; }
@media (max-width:1024px){ .ar-awards{ grid-template-columns:1fr 1fr; } .ar-story{ grid-template-columns:1fr; } }
/* the post FAQ band (nd-system paints it a light gradient) and the journal's light bands go dark */
html[data-theme="ar"] .nd-plane section.hp-faq{ background:#0A0A0D !important; }
html[data-theme="ar"] .nd-plane section.hp-faq .nd-h2, html[data-theme="ar"] .nd-plane section.hp-faq .nd-eyebrow{ color:#FFFFFF !important; }
html[data-theme="ar"] .nd-plane section.hp-faq .nd-faq details, html[data-theme="ar"] .nd-plane section.hp-faq .nd-faqx__card{ background:#15161C !important; border-color:rgba(255,255,255,.12) !important; box-shadow:none !important; }
html[data-theme="ar"] .nd-plane section.hp-faq .nd-faq details *{ color:#FFFFFF; }
.ar-person{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(32px,6vw,96px); align-items:start; }
.ar-person__card{ border-radius:28px; overflow:hidden; background:linear-gradient(160deg,#C9D4FF 0%,#E7DAFF 50%,#FFE9B8 100%); aspect-ratio:1; }
.ar-person__card img{ width:100%; height:100%; object-fit:cover; object-position:top; display:block; }
.ar-person .ar-pill-w{ display:inline-flex; align-items:center; height:48px; padding:0 22px; border-radius:999px; background:#fff; color:#0B0E14 !important; font-size:15px; font-weight:500; text-decoration:none; }
html[data-theme="ar"] .nd-pg-team .nd-ccard, html[data-theme="ar"] .nd-pg-team .nd-card2{ background:#15161C !important; border-color:rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-pg-team .nd-ccard *, html[data-theme="ar"] .nd-pg-team .nd-card2 *{ color:#FFFFFF; }
@media (max-width:900px){ .ar-person{ grid-template-columns:1fr; } }
/* arounda's content runs ~1395px wide at 1440 (24px gutters); ours sat in a 1240px column, which is why
   everything of theirs read "a little bigger" (founder, screen recording 2026-10-30) */
html[data-theme="ar"] .ar .nd-container, html[data-theme="ar"] .nd-nav-in, html[data-theme="ar"] .nd-ft-in{ width:min(100% - 48px, 1400px) !important; max-width:1400px !important; margin-inline:auto; }
html[data-theme="ar"] .nd-plane .nd-container{ width:min(100% - 48px, 1400px) !important; max-width:1400px !important; }
.ar .ar-h--xl{ font-size:clamp(44px,6.8vw,92px) !important; } .ar .ar-h--l{ font-size:clamp(36px,5vw,66px) !important; } .ar .ar-h--m{ font-size:clamp(30px,3.8vw,50px) !important; }
.ar .ar-sub{ font-size:clamp(17px,1.3vw,20px) !important; }
.ar-stack .ar-case__text{ max-width:440px; } .ar-stack .ar-case__h{ font-size:clamp(26px,2.5vw,34px) !important; }
.ar .ar-case__quote p, .ar .ar-case__p{ font-size:17px !important; }
html[data-theme="ar"] .nd-nav-links a{ font-size:18px !important; }
/* dropdown rows were inheriting the bar's centring: everything in the panels is left-aligned */
html[data-theme="ar"] .nd-mega__in, html[data-theme="ar"] .nd-mega__in *{ text-align:left !important; }
html[data-theme="ar"] .nd-mega__list li{ display:block; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-mega__item{ width:100%; justify-content:space-between !important; }
html[data-theme="ar"] .nd-mega__txt{ display:flex !important; flex-direction:column; align-items:flex-start !important; width:100%; }
html[data-theme="ar"] .nd-nav .nd-nav-links a.nd-mega__all{ display:inline-flex !important; width:auto; gap:8px; }
/* no coloured plate behind a render (founder, 2026-10-30: "no need those backgrounds on mockup") */
.ar-stack .ar-plate, .ar-row-case__img, .ar-feat__img, .ar-wtile figure, .hl-card__img{ background:#111115 !important; }
.ar-row-case__img img{ padding:0 !important; object-fit:cover !important; }
/* one render per case (founder), so the plate itself is tall: the text pins at the nav while the
   plate scrolls past it, then the next case comes up — the way theirs reads with three images */
.ar-stack .ar-plate{ aspect-ratio:auto !important; min-height:calc(100vh - var(--nd-nav-h,104px) - 40px) !important; max-height:900px; }
.ar-stack .ar-plate img{ object-fit:contain !important; padding:0 !important; }
.ar-stack .ar-case__text{ top:calc(var(--nd-nav-h,104px) + 24px); }
.ar-stack{ gap:clamp(80px,10vw,140px) !important; }
@media (max-width:767px){ .ar-stack .ar-plate{ min-height:0 !important; aspect-ratio:1280/880 !important; } }
/* the hero quote card: ink text on white (it was inheriting the muted grey) */
.ar-quote-card, .ar-quote-card > p, .ar-quote-card b, .ar-quote-card strong{ color:#0B0E14 !important; }
.ar-quote-card > p{ font-size:clamp(18px,1.5vw,22px) !important; line-height:1.4 !important; }
/* team page: the light quote figure */
html[data-theme="ar"] .nd-pg-team .tm-quote, html[data-theme="ar"] .nd-plane .tm-quote{ background:#15161C !important; border:1px solid rgba(255,255,255,.12) !important; }
html[data-theme="ar"] .nd-plane .tm-quote *{ color:#FFFFFF !important; }
/* ---------- article prose (founder: "many blogs have spacing and formatting issues") ----------
   The kit's `.ar p, .ar h2, .ar ul {margin:0}` reset reached into the mounted PostBody; the prose
   gets its rhythm back here, scoped to the article column, and the column narrows to Halo's ~760px. */
.hl-art .nd-plane{ max-width:780px; }
.hl-art .nd-plane p{ margin:0 0 18px !important; font-size:17px !important; line-height:1.7 !important; color:rgba(255,255,255,.86) !important; }
.hl-art .nd-plane h2{ margin:48px 0 16px !important; font-size:clamp(26px,2.4vw,34px) !important; line-height:1.2 !important; }
.hl-art .nd-plane h3{ margin:34px 0 12px !important; font-size:clamp(21px,1.8vw,26px) !important; line-height:1.25 !important; }
.hl-art .nd-plane h4{ margin:26px 0 10px !important; font-size:18px !important; }
.hl-art .nd-plane ul, .hl-art .nd-plane ol{ margin:0 0 22px !important; padding-left:24px !important; }
.hl-art .nd-plane ul{ list-style:disc !important; } .hl-art .nd-plane ol{ list-style:decimal !important; }
.hl-art .nd-plane li{ margin:0 0 8px !important; font-size:17px !important; line-height:1.6 !important; color:rgba(255,255,255,.86) !important; }
.hl-art .nd-plane li::marker{ color:#FFF83F; }
.hl-art .nd-plane .nd-checks, .hl-art .nd-plane .nd-faq, .hl-art .nd-plane .nd-toc{ list-style:none !important; padding-left:0 !important; }
.hl-art .nd-plane blockquote{ margin:28px 0 !important; padding:18px 24px; border-left:3px solid #FFF83F; background:rgba(255,255,255,.04); border-radius:0 16px 16px 0; }
.hl-art .nd-plane figure, .hl-art .nd-plane img{ margin:28px 0 !important; max-width:100%; border-radius:16px; }
.hl-art .nd-plane figcaption{ margin:-18px 0 24px !important; font-size:13px; color:var(--ar-mute); text-align:center; }
.hl-art .nd-plane table{ margin:24px 0 !important; } .hl-art .nd-plane th, .hl-art .nd-plane td{ padding:12px 14px !important; font-size:15px !important; line-height:1.5 !important; vertical-align:top; }
.hl-art .nd-plane .nd-card2{ margin:28px 0 !important; padding:24px !important; } .hl-art .nd-plane .nd-card2 h3{ margin-top:6px !important; font-size:22px !important; }
.hl-art .nd-plane .nd-card2 li{ margin:0 0 10px !important; }
.hl-art .nd-plane a{ color:#8FB0FF; text-decoration:underline; text-underline-offset:3px; }
.hl-art .nd-plane hr{ margin:36px 0 !important; border:0; border-top:1px solid rgba(255,255,255,.12); }
.hl-art .nd-plane strong, .hl-art .nd-plane b{ color:#fff; }
.hl-art .nd-plane > *:first-child{ margin-top:0 !important; }
/* client logo marquee: every logo, left to right, seamless */
.ar-logos__marquee{ overflow:hidden; margin-top:14px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.ar-logos__track{ display:flex; gap:14px; width:max-content; animation:ar-marquee 36s linear infinite; }
.ar-logos__track > span{ flex:none; display:grid; place-items:center; width:210px; height:76px; border-radius:16px; background:#fff; padding:14px 22px; }
.ar-logos__track img{ max-width:100%; max-height:40px; width:auto; height:auto; object-fit:contain; }
.ar-logos__marquee:hover .ar-logos__track{ animation-play-state:paused; }
@keyframes ar-marquee{ from{ transform:translateX(-50%); } to{ transform:translateX(0); } }
@media (prefers-reduced-motion:reduce){ .ar-logos__track{ animation:none; flex-wrap:wrap; width:auto; justify-content:center; } .ar-logos__track > span[aria-hidden]{ display:none; } }
/* ---------- case stack, take 3 (founder: "still not like them scroll", "no empty space") ----------
   One render per case, at its own ratio, no letterbox. Each whole case fills the screen and pins
   under the nav; the next case slides up over it, one by one, until the last. */
.ar-stack{ gap:0 !important; }
.ar-stack .ar-case{ position:sticky; top:calc(var(--nd-nav-h,104px) + 12px); min-height:calc(100vh - var(--nd-nav-h,104px) - 12px); align-items:center !important; padding:28px 0 36px; background:#0A0A0D; box-shadow:0 -40px 80px -40px rgba(0,0,0,.9); }
.ar-stack .ar-case__text{ position:static; }
.ar-stack .ar-plate{ min-height:0 !important; max-height:none; aspect-ratio:1280/880 !important; }
.ar-stack .ar-plate img{ object-fit:contain !important; }
.ar-stack__more{ position:relative; z-index:2; background:#0A0A0D; padding-top:40px; margin-top:0 !important; }
@media (max-width:767px){ .ar-stack .ar-case{ position:static; min-height:0; } }
@media (prefers-reduced-motion:reduce){ .ar-stack .ar-case{ position:static; min-height:0; } }
/* ---------- case block, as measured on arounda.agency (final) ----------
   .home-reviews-content: flex row, text column sticky top 110px (max 405px), image column of
   485px-tall frames, 10px apart, radius 30px, object-fit cover at 35% 50%; 240px between cases. */
.ar-stack{ gap:240px !important; }
.ar-stack .ar-case{ position:relative !important; top:auto !important; min-height:0 !important; padding:0 !important; box-shadow:none !important; align-items:flex-start !important; gap:88px; }
.ar-stack .ar-case__text{ position:sticky !important; top:110px !important; max-width:405px; }
.ar-stack .ar-case__media{ gap:10px; }
.ar-stack .ar-plate{ aspect-ratio:auto !important; height:485px; min-height:0 !important; max-height:none; border-radius:30px; }
.ar-stack .ar-plate img{ object-fit:cover !important; object-position:35% 50% !important; padding:0 !important; }
.ar-stack .ar-case__media:has(> .ar-plate:only-child) .ar-plate{ height:620px; }
.ar-stack__more{ padding-top:0; margin-top:80px !important; }
@media (max-width:1024px){ .ar-stack .ar-case{ gap:40px; } .ar-stack .ar-case__text{ max-width:320px; } .ar-stack .ar-plate{ height:400px; } }
@media (max-width:767px){ .ar-stack{ gap:72px !important; } .ar-stack .ar-case{ flex-direction:column; } .ar-stack .ar-case__text{ position:static !important; max-width:none; } .ar-stack .ar-plate, .ar-stack .ar-case__media:has(> .ar-plate:only-child) .ar-plate{ height:auto; aspect-ratio:1280/880 !important; } .ar-stack .ar-plate img{ object-fit:contain !important; } }
.ar-logo-text{ font-family:var(--ar-display) !important; font-weight:700; font-size:15px; letter-spacing:.14em; color:#0B0E14; white-space:nowrap; }
.ar-stat__float .ar-logo-text{ font-size:11px; letter-spacing:.1em; }
/* ---------- journal: gradient CTAs, tags, prev/next, author (founder: "improve this design", "3 nice CTAs with our gradient") ---------- */
.hl-cta{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:28px; align-items:center; margin:40px 0 8px; padding:clamp(24px,3vw,36px); border-radius:28px; max-width:780px; color:#0B0E14; background:radial-gradient(120% 140% at 0% 0%, #4A6BFF 0%, #6E3DF5 42%, #F3F0FF 100%); }
.hl-cta .ar-eyebrow{ color:rgba(255,255,255,.8); } .hl-cta h3{ margin-top:10px !important; font-size:clamp(22px,2vw,28px) !important; line-height:1.15 !important; color:#fff !important; }
.hl-cta p{ margin-top:10px; font-size:15px; line-height:1.5; color:rgba(255,255,255,.88); }
.hl-cta__links{ display:grid; gap:8px; justify-items:start; }
.hl-cta__links .ar-pill-w{ display:inline-flex; align-items:center; height:46px; padding:0 20px; border-radius:999px; background:#0B0E14; color:#fff !important; font-size:15px; font-weight:500; text-decoration:none; margin-bottom:6px; }
.hl-cta__links a:not(.ar-pill-w){ color:#0B0E14; font-size:14px; font-weight:500; text-decoration:none; } .hl-cta__links a:not(.ar-pill-w):hover{ text-decoration:underline; }
.hl-ask{ background:radial-gradient(120% 140% at 100% 0%, #4A6BFF 0%, #6E3DF5 45%, #1B1F3A 100%); }
.hl-art .nd-plane .nd-posttags{ margin:36px 0 0 !important; } .hl-art .nd-plane .nd-tags{ list-style:none !important; padding:0 !important; margin:0 !important; display:flex; gap:8px; }
.hl-art .nd-plane .nd-tags li{ margin:0 !important; } .hl-art .nd-plane .nd-tags a{ display:inline-flex; align-items:center; height:36px; padding:0 14px; border-radius:999px; background:rgba(255,255,255,.08); color:#fff; text-decoration:none; font-size:13px; }
.hl-art .nd-plane .nd-postnav{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:24px 0 0 !important; }
.hl-art .nd-plane .nd-postnav .nd-card2{ display:flex !important; flex-direction:column; gap:8px; margin:0 !important; padding:20px 22px !important; border-radius:18px; background:#15161C !important; border:1px solid rgba(255,255,255,.1); text-decoration:none; }
.hl-art .nd-plane .nd-postnav small{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ar-mute); }
.hl-art .nd-plane .nd-postnav b{ font-size:16px; line-height:1.3; color:#fff; font-weight:500; text-decoration:none; }
.hl-art .nd-plane .nd-postnav .nd-card2--next{ text-align:right; align-items:flex-end; }
.hl-art .nd-plane .nd-author{ display:grid !important; grid-template-columns:96px minmax(0,1fr); gap:20px 24px; align-items:start; margin:16px 0 0 !important; padding:24px !important; border-radius:22px; background:#15161C !important; border:1px solid rgba(255,255,255,.1); }
.hl-art .nd-plane .nd-author img{ width:96px; height:96px; border-radius:18px; object-fit:cover; margin:0 !important; }
.hl-art .nd-plane .nd-author .nd-eyebrow{ margin:0 0 6px; } .hl-art .nd-plane .nd-author .nd-card2__t{ font-size:18px !important; margin:0 !important; } .hl-art .nd-plane .nd-author .nd-card2__p{ margin:2px 0 0 !important; color:var(--ar-mute) !important; font-size:14px !important; }
.hl-art .nd-plane .nd-author__bio{ margin:10px 0 0 !important; font-size:15px !important; line-height:1.55 !important; } .hl-art .nd-plane .nd-author .nd-btn{ margin-top:14px; }
@media (max-width:767px){ .hl-cta{ grid-template-columns:1fr; } .hl-art .nd-plane .nd-postnav{ grid-template-columns:1fr; } .hl-art .nd-plane .nd-author{ grid-template-columns:1fr; } }
/* ---------- footer gradient (founder: "on footer I want gradient") ---------- */
html[data-theme="ar"] .nd-ft{ background:radial-gradient(90% 70% at 15% 0%, rgba(74,86,255,.55) 0%, rgba(110,61,245,.28) 38%, rgba(10,10,13,0) 70%), radial-gradient(60% 50% at 95% 100%, rgba(31,73,230,.3) 0%, rgba(10,10,13,0) 70%), #0A0A0D !important; }
/* footer gradient rises from the bottom (founder, 2026-10-30) */
html[data-theme="ar"] .nd-ft{ background:radial-gradient(90% 80% at 50% 115%, rgba(86,78,255,.75) 0%, rgba(110,61,245,.42) 32%, rgba(31,73,230,.16) 58%, rgba(10,10,13,0) 80%), #0A0A0D !important; }
/* ---------- sticky was dead: `.ar{overflow:hidden}` (there to clip the glows) turns the page wrapper
   into a scroll container, and position:sticky never engages inside one. `overflow-x: clip` clips the
   glows without creating a scroll container, so the case text pins again. ---------- */
.ar, .ar.ar-pg{ overflow:visible !important; overflow-x:clip !important; }
/* ---------- renders FIT their frames (founder: "many mockups zoomed which not fit"): every frame takes
   the render's own ratio and object-fit: contain, home cases and the works grid alike ---------- */
.ar-stack .ar-plate{ height:auto !important; aspect-ratio:1280/880 !important; }
.ar-stack .ar-case__media:has(> .ar-plate:only-child) .ar-plate{ height:auto !important; }
.ar-stack .ar-plate img{ object-fit:contain !important; object-position:50% 50% !important; }
.ar-wtile figure{ aspect-ratio:1280/880 !important; } .ar-wtile figure img{ object-fit:contain !important; }
.ar-feat__img{ aspect-ratio:1280/880 !important; } .ar-feat__img img{ object-fit:contain !important; }
.ar-row-case__img{ aspect-ratio:1280/880 !important; } .ar-row-case__img img{ object-fit:contain !important; }
.hl-card__img img{ object-fit:cover; }
/* ---------- blend (founder): every glow fades out inside its own box, and the page fades into the footer ---------- */
.ar-sec::before, .ar-sec::after, .ar-hero::before, .ar-hero::after, .ar-glow{ -webkit-mask-image:radial-gradient(closest-side, #000 45%, rgba(0,0,0,.6) 70%, transparent 100%); mask-image:radial-gradient(closest-side, #000 45%, rgba(0,0,0,.6) 70%, transparent 100%); }
.ar-sec{ overflow:visible !important; }
.ar.ar-pg{ position:relative; }
.ar.ar-pg::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:260px; pointer-events:none; z-index:1; background:linear-gradient(180deg, rgba(10,10,13,0) 0%, #0A0A0D 100%); }
html[data-theme="ar"] .nd-ft{ position:relative; z-index:2; }
/* works tiles read like theirs: one short line under the title */
.ar-wtile p{ display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
/* footer bottom row: lockup and the © line on one baseline */
html[data-theme="ar"] .nd-ft .nd-ft-legal{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
html[data-theme="ar"] .nd-ft .nd-ft-lg1{ display:flex; align-items:center; gap:18px; }
html[data-theme="ar"] .nd-ft .nd-ft-lg1 .nd-ft-l, html[data-theme="ar"] .nd-ft .nd-ft-profiles{ margin:0 !important; }
html[data-theme="ar"] .nd-ft .nd-lockup-link{ display:inline-flex; align-items:center; }
/* page exports in the case block sit in a browser window: a chrome bar with three dots, the page
   from its top, the frame at the same ratio as a render plate */
.ar-stack .ar-plate.is-shot{ background:#15161C !important; padding-top:34px; }
.ar-stack .ar-plate.is-shot::before{ content:""; position:absolute; left:0; right:0; top:0; height:34px; background:#1E1F27; border-bottom:1px solid rgba(255,255,255,.08); z-index:1; }
.ar-stack .ar-plate.is-shot::after{ content:""; position:absolute; left:16px; top:12px; width:10px; height:10px; border-radius:50%; background:#FF5F57; box-shadow:16px 0 0 #FEBC2E, 32px 0 0 #28C840; z-index:2; }
.ar-stack .ar-plate.is-shot img{ top:34px; height:calc(100% - 34px); object-fit:cover !important; object-position:50% 0 !important; }
/* video plates (the studio's YouTube walkthroughs), 16:9, muted autoplay loop */
.ar-stack .ar-plate.is-video{ aspect-ratio:16/9 !important; background:#000 !important; }
.ar-stack .ar-plate.is-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
/* YouTube's hover chrome (title, logo, "More videos") only appears on hover and sits at the very top
   and bottom of the player: the plate takes no pointer events, and the player is oversized and
   centred so those bands fall outside the rounded frame (founder: "hide YT option") */
.ar-stack .ar-plate.is-video{ pointer-events:none; }
.ar-stack .ar-plate.is-video iframe{ top:50% !important; left:50% !important; width:124% !important; height:124% !important; transform:translate(-50%,-50%); }
/* no crop on the video (founder): the player fills the frame exactly; pointer-events stay off so the hover chrome never appears */
.ar-stack .ar-plate.is-video iframe{ width:100% !important; height:100% !important; top:0 !important; left:0 !important; transform:none !important; }
/* self-hosted video plates: fill the frame, no chrome at all; plays only while in view */
.ar-stack .ar-plate.is-video .ar-vid{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; background:#000; }
/* hero pill words → service pages; on hover the word takes its hue and two glowing icon chips pop out (arounda) */
.ar-hero .ar-pill{ position:relative; text-decoration:none; color:inherit; transition:background .25s; }
.ar-hero .ar-pill:hover{ background:rgba(255,255,255,.12); }
.ar-hero .ar-pill--b:hover .ar-i{ color:#6B9BFF !important; } .ar-hero .ar-pill--v:hover .ar-i{ color:#B392FF !important; } .ar-hero .ar-pill--a:hover .ar-i{ color:#FFF83F !important; }
.ar-pill__c{ position:absolute; display:grid; place-items:center; width:.55em; height:.55em; border-radius:.14em; font-style:normal; font-size:.28em; line-height:1; color:#0B0E14; opacity:0; transform:scale(.4); transition:opacity .3s, transform .35s cubic-bezier(.2,.8,.2,1.2); pointer-events:none; }
.ar-pill__c--1{ top:-.3em; right:-.25em; } .ar-pill__c--2{ bottom:-.3em; left:-.25em; transition-delay:.06s; }
.ar-pill--b .ar-pill__c{ background:#6B9BFF; box-shadow:0 0 24px rgba(107,155,255,.9); } .ar-pill--v .ar-pill__c{ background:#B392FF; box-shadow:0 0 24px rgba(179,146,255,.9); } .ar-pill--a .ar-pill__c{ background:#FFF83F; box-shadow:0 0 24px rgba(255,248,63,.9); }
.ar-hero .ar-pill:hover .ar-pill__c{ opacity:1; transform:scale(1); }
/* video plates are 16:9 like the videos themselves: no black bands (founder) */
.ar-stack .ar-plate.is-video{ aspect-ratio:16/9 !important; padding:0 !important; }
.ar-stack .ar-plate.is-video .ar-vid, .ar-stack .ar-plate.is-video video{ object-fit:cover !important; }
/* ---------- pricing plans, redesigned on arounda's panel (founder: "pricing still not good, redesign") ----------
   deep navy panel lit from the top in cobalt (their blue, not purple), translucent cards with a hairline,
   the switch-style toggle, roomy type, a white Start pill, divider, 15px ticks; Popular outlined in amber. */
.ar-plans{ position:relative; overflow:hidden; margin-top:clamp(40px,5vw,64px) !important; padding:clamp(28px,3.4vw,48px) !important; border-radius:36px !important; border:1px solid rgba(255,255,255,.08) !important;
  background:linear-gradient(180deg,#0F1626 0%,#0B0E18 55%,#0A0A0D 100%) !important; backdrop-filter:none !important; }
.ar-plans::before{ content:""; position:absolute; left:50%; top:-40%; width:120%; height:90%; transform:translateX(-50%); pointer-events:none;
  background:radial-gradient(closest-side, rgba(74,120,255,.42) 0%, rgba(31,73,230,.18) 45%, rgba(10,10,13,0) 100%); }
.ar-plans > *{ position:relative; }
.ar-toggle{ display:inline-flex !important; margin:0 auto clamp(26px,3vw,40px) !important; padding:5px; border-radius:999px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); gap:4px !important; }
.ar-plans .ar-toggle{ display:flex !important; width:max-content; }
.ar-toggle button{ height:40px !important; padding:0 22px !important; border:0 !important; background:transparent !important; color:#C9CDD6 !important; font-size:15px !important; border-radius:999px !important; }
.ar-toggle button.is-on{ background:#FFFFFF !important; color:#0B0E14 !important; }
.ar-plan-grid{ gap:18px !important; align-items:stretch !important; }
.ar-plan{ display:flex; flex-direction:column; padding:32px 30px 22px !important; border-radius:26px !important; background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.1) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.ar-plan--pop{ border-color:rgba(255,248,63,.7) !important; background:linear-gradient(180deg, rgba(255,248,63,.07), rgba(255,255,255,.045) 40%) !important; }
.ar-plan__name{ font-size:24px !important; }
.ar-plan__price{ margin-top:22px !important; font-size:clamp(38px,3.6vw,52px) !important; }
.ar-plan__price small{ font-size:15px !important; }
.ar-plan__scope{ margin-top:14px !important; font-size:16px !important; line-height:1.5 !important; color:#C9CDD6 !important; min-height:48px !important; }
.ar-plan .ar-pill-w{ height:52px !important; padding:0 30px !important; margin-top:26px !important; font-size:16px !important; }
.ar-plan__sep{ margin:28px -30px 8px !important; background:rgba(255,255,255,.1) !important; }
.ar-plan .ar-tick li{ font-size:15px !important; line-height:1.5 !important; padding:9px 0 !important; }
.ar-plan .ar-tick li::before{ color:#FFF83F !important; }
.ar-plan__note{ margin-top:auto !important; padding-top:14px; font-size:13px !important; color:#8A90A0 !important; }
.ar-plans .ar-sub.ar-center{ color:#A3A8B3; }
@media (max-width:640px){ .ar-plans{ padding:20px 14px !important; border-radius:26px !important; } .ar-plan{ padding:24px 20px 18px !important; } .ar-plan__sep{ margin:22px -20px 6px !important; } .ar-plans .ar-toggle{ width:100%; justify-content:center; flex-wrap:wrap; } }

/* ---------- verified badges, designed (founder 2026-10-30: "so they can know we verified") ----------
   two sealed cards: a check-seal in the corner, the score big, the stars, the platform and the line. */
.ar-badges{ max-width:720px !important; gap:18px !important; }
.ar-badge{ position:relative; overflow:hidden; padding:30px 26px 26px !important; text-align:center; border-radius:24px; border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); box-shadow:inset 0 1px 0 rgba(255,255,255,.1); transition:transform .3s, border-color .3s; }
.ar-badge::before{ content:""; position:absolute; inset:-40% -20% auto; height:120%; pointer-events:none; opacity:.55;
  background:radial-gradient(closest-side, rgba(31,73,230,.55), rgba(31,73,230,0)); }
.ar-badge--dr::before{ background:radial-gradient(closest-side, rgba(255,248,63,.35), rgba(255,248,63,0)); }
.ar-badge > *{ position:relative; }
.ar-badge:hover{ transform:translateY(-3px); border-color:rgba(255,255,255,.28); }
.ar-badge__seal{ position:absolute !important; top:16px; right:16px; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.08); color:#5B8CFF; }
.ar-badge--dr .ar-badge__seal{ color:#FFF83F; }
.ar-badge b{ display:block; font-size:44px !important; font-weight:600 !important; letter-spacing:-.03em; line-height:1; color:#fff; }
.ar-badge__stars{ display:block; margin-top:10px !important; font-size:13px !important; color:#FFF83F !important; letter-spacing:.08em; }
.ar-badge__stars .ar-stars{ font-size:16px; letter-spacing:.12em; }
.ar-badge__who{ display:block; margin-top:16px !important; font-size:16px !important; font-weight:600; color:#fff !important; }
.ar-badge__what{ display:block; margin-top:4px !important; font-size:13px !important; color:var(--ar-mute); }
.ar-badge::after{ content:"Verified"; position:absolute; left:16px; top:16px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.5); }

/* ---------- pricing: no outer panel, gradient under the cards (founder 2026-10-30) ---------- */
.ar-plans{ padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; overflow:visible !important; }
.ar-plans::before{ top:auto; bottom:-38%; height:110%; width:110%; opacity:.9;
  background:radial-gradient(closest-side, rgba(31,73,230,.55) 0%, rgba(74,120,255,.22) 45%, rgba(10,10,13,0) 100%) !important; filter:blur(10px); }
.ar-plan{ background:linear-gradient(180deg, rgba(16,20,34,.92) 0%, rgba(12,14,24,.9) 100%) !important; backdrop-filter:blur(8px); }
.ar-plan--pop{ background:linear-gradient(180deg, rgba(255,248,63,.08), rgba(14,18,32,.92) 38%) !important; }
.ar-plan-grid{ gap:20px !important; }
@media (max-width:640px){ .ar-plans{ padding:0 !important; } }
.ar-badge__stars .ar-stars{ color:#FFF83F; }
/* founder 2026-10-30: "we only need pricing card, not our background section" — no glow, the gradient lives inside each card. */
.ar-plans::before{ display:none !important; }
.ar-plan{ background:linear-gradient(180deg, #0C0E14 0%, #0E1424 55%, #15275C 100%) !important; border-color:rgba(255,255,255,.12) !important; backdrop-filter:none; }
.ar-plan--pop{ background:linear-gradient(180deg, #14110A 0%, #0E1424 50%, #1A2F6E 100%) !important; }
/* /portfolio featured card: frame takes the render's own ratio (no black bars); chips readable on white (founder 2026-10-30) */
.ar-feat__img{ aspect-ratio:auto !important; background:#fff !important; }
.ar-feat__img img{ width:100%; height:auto !important; object-fit:unset !important; }
.ar-feat__cap .ar-chip{ background:#EEF0F5 !important; color:#0B0E14 !important; border:1px solid #E1E4EC !important; }

/* ---------- founder 2026-10-30 (QA round): seal centred, video corners clipped, compare table designed ---------- */
.ar-badge{ padding-top:26px !important; }
.ar-badge__seal{ position:static !important; margin:0 auto 14px; width:40px; height:40px; background:rgba(255,255,255,.1); box-shadow:0 0 0 6px rgba(255,255,255,.04); }
.ar-badge__seal svg{ width:22px; height:22px; }
.ar-badge::after{ left:50%; transform:translateX(-50%); top:auto; bottom:14px; opacity:.0; }
.ar-stack .ar-plate.is-video{ overflow:hidden !important; border-radius:28px !important; isolation:isolate; transform:translateZ(0); }
.ar-stack .ar-plate.is-video .ar-vid{ border-radius:inherit; }

/* compare table: dark glass board, our column lifted in cobalt, factor labels as small caps, soft checks */
html[data-theme="ar"] .nd-plane .ct-wrap{ background:linear-gradient(180deg,#121218,#0E0E12) !important; border:1px solid rgba(255,255,255,.1) !important; border-radius:28px !important; box-shadow:0 30px 80px -40px rgba(0,0,0,.8) !important; padding:10px; }
html[data-theme="ar"] .nd-plane .ct-table{ min-width:860px; font-size:15px !important; }
html[data-theme="ar"] .nd-plane .ct-table th, html[data-theme="ar"] .nd-plane .ct-table td{ padding:20px 22px !important; border-bottom:1px solid rgba(255,255,255,.07) !important; }
html[data-theme="ar"] .nd-plane .ct-table thead th{ background:transparent !important; color:#8A90A0 !important; font-size:12px !important; letter-spacing:.14em; text-transform:uppercase; font-weight:600 !important; padding-bottom:16px !important; }
html[data-theme="ar"] .nd-plane .ct-table tbody th{ background:transparent !important; color:#FFFFFF !important; font-weight:600 !important; font-size:16px !important; }
html[data-theme="ar"] .nd-plane .ct-table td{ color:#B9BEC9 !important; }
html[data-theme="ar"] .nd-plane .ct-table .is-us{ background:linear-gradient(180deg, rgba(31,73,230,.30), rgba(31,73,230,.16)) !important; color:#FFFFFF !important; font-weight:500 !important; border-left:1px solid rgba(91,140,255,.35) !important; border-right:1px solid rgba(91,140,255,.35) !important; }
html[data-theme="ar"] .nd-plane .ct-table thead .is-us{ background:#1F49E6 !important; color:#FFFFFF !important; border-radius:18px 18px 0 0; font-size:13px !important; letter-spacing:.1em; }
html[data-theme="ar"] .nd-plane .ct-table tbody tr:last-child .is-us{ border-radius:0 0 18px 18px; }
html[data-theme="ar"] .nd-plane .ct-table tbody tr:last-child td, html[data-theme="ar"] .nd-plane .ct-table tbody tr:last-child th{ border-bottom:0 !important; }
html[data-theme="ar"] .nd-plane .ct-ok{ width:24px; height:24px; margin-right:12px; background:#5B8CFF !important; color:#0B0E14 !important; box-shadow:0 0 0 4px rgba(91,140,255,.2); }
html[data-theme="ar"] .nd-plane .ct-note{ color:#8A90A0 !important; }
html[data-theme="ar"] .nd-plane .ct-note a{ color:#8FB0FF !important; }

/* ---------- responsive QA 2026-10-30 ---------- */
.ar-fbar{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:28px; align-items:center; margin-top:24px; padding:26px 30px; border-radius:30px; background:var(--ar-card); }
.ar-fbar__t{ font-size:clamp(20px,1.8vw,26px); line-height:1.3; font-weight:500; min-width:0; }
@media (max-width:900px){ .ar-fbar{ grid-template-columns:1fr; gap:18px; padding:22px; border-radius:24px; } .ar-fbar__t{ font-size:19px; } }
/* long article tables scroll inside their own box on phones */
.hl-art .nd-plane table, .nd-plane .nd-tblwrap table{ max-width:100%; }
@media (max-width:760px){ .hl-art .nd-plane table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; } }
/* the fixed-price quote panel is light: ink text, not white */
html[data-theme="ar"] .nd-plane .qc-panel, html[data-theme="ar"] .nd-plane .qc-panel :is(h2,h3,p,.qc-h,.qc-lead,.nd-h2){ color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .qc-panel .nd-eyebrow{ background:#0B0E14 !important; color:#fff !important; }
html[data-theme="ar"] .nd-plane .qc-row, html[data-theme="ar"] .nd-plane .qc-row b, html[data-theme="ar"] .nd-plane .qc-price{ color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .qc-row small{ color:#4A5060 !important; }
/* stat tiles on phones: natural height */
@media (max-width:640px){ .ar-fstats > div:not(.ar-fstats__founder){ min-height:0 !important; padding:22px !important; display:flex; align-items:baseline; gap:14px; } .ar-fstats > div:not(.ar-fstats__founder) b{ font-size:34px !important; } }

/* ---------- buttons: the mark's bright violet instead of yellow (founder 2026-10-30: "for yellow button use bright purple the logo has") ----------
   Only the call pills, buttons and selected chips change; stars, ticks and the amber quote card stay. */
html[data-theme="ar"], .ar{ --ar-btn:#7B4DFF; --ar-btn-hi:#8F67FF; --ar-btn-ink:#FFFFFF; }
.ar-call__arrow{ background:#6E3DF5 !important; color:#FFFFFF !important; }
.ar-call__main{ background:var(--ar-btn) !important; color:var(--ar-btn-ink) !important; }
.ar-call:hover .ar-call__main{ background:var(--ar-btn-hi) !important; }
.ar-call:hover .ar-call__arrow{ background:#7B4DFF !important; }
.ar-chip.is-on, .ar-form .ar-chip:has(input:checked), .ar-pager [aria-current], .hl-pager span[aria-current], .hl-rail__in a:hover{ background:var(--ar-btn) !important; color:#FFFFFF !important; }
.ar-rail button.is-on{ background:var(--ar-btn) !important; color:#FFFFFF !important; }
.ar-plan .ar-pill-w:hover{ background:#E9E2FF !important; }
.ar-tl em{ background:var(--ar-btn) !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-ft .nd-btn, html[data-theme="ar"] .nd-ft .nd-btn span, html[data-theme="ar"] .nd-plane .fc-form .nd-btn, html[data-theme="ar"] .nd-plane .fc-chip input:checked + span{ background:var(--ar-btn) !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-ft .nd-btn:hover, html[data-theme="ar"] .nd-plane .fc-form .nd-btn:hover{ background:var(--ar-btn-hi) !important; }
html[data-theme="ar"] .nd-plane .fc-input:focus{ border-color:#7B4DFF !important; box-shadow:0 0 0 3px rgba(123,77,255,.25) !important; }
.ar-cta .ar-call__main{ background:var(--ar-btn) !important; color:#fff !important; }

/* contact (founder 2026-10-30): chips aligned, round tick boxes, serif accent + outline button readable in the quote panel */
.ar-chip--radio{ position:relative; display:inline-flex; align-items:center; height:38px; padding:0 16px; line-height:1; cursor:pointer; }
.ar-chip--radio input{ position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.ar-form .ar-chips{ align-items:center; }
.ar-contact__side .ar-list--sm li{ display:flex; align-items:flex-start; gap:14px; }
.ar-contact__side .ar-list--sm li::before{ content:"✓" !important; flex:0 0 auto; display:inline-grid !important; place-items:center; width:24px; height:24px; margin-top:-1px; border-radius:50%; background:#7B4DFF; color:#fff !important; font-size:12px; font-weight:700; position:static !important; }
html[data-theme="ar"] .nd-plane .qc-panel .nd-serif-accent{ color:#6E3DF5 !important; }
html[data-theme="ar"] .nd-plane .qc-btns .nd-btn--outline, html[data-theme="ar"] .nd-plane .qc-btns .nd-btn--outline span{ color:#0B0E14 !important; border:1px solid rgba(11,14,20,.2) !important; background:#fff !important; }
html[data-theme="ar"] .nd-plane .qc-btns .nd-btn:not(.nd-btn--outline){ background:#7B4DFF !important; color:#fff !important; }
.ar-chip--radio{ display:inline-flex !important; align-items:center !important; justify-content:center; height:38px !important; padding:0 16px !important; margin:0 !important; line-height:38px !important; }

/* founder 2026-10-30, after seeing the violet: "use light yellow on button". Same scope as the block above, lighter than the old #FFF83F. */
html[data-theme="ar"], .ar{ --ar-btn:#FFF83F; --ar-btn-hi:#FFFA7A; --ar-btn-ink:#0B0E14; }
.ar-call__arrow{ background:#FFF83F !important; color:#0B0E14 !important; }
.ar-call:hover .ar-call__arrow{ background:#FFFA7A !important; }
.ar-call__main, .ar-cta .ar-call__main{ color:#0B0E14 !important; }
.ar-chip.is-on, .ar-form .ar-chip:has(input:checked), .ar-pager [aria-current], .hl-pager span[aria-current], .hl-rail__in a:hover, .ar-rail button.is-on, .ar-tl em,
html[data-theme="ar"] .nd-ft .nd-btn, html[data-theme="ar"] .nd-ft .nd-btn span, html[data-theme="ar"] .nd-plane .fc-form .nd-btn, html[data-theme="ar"] .nd-plane .fc-chip input:checked + span,
html[data-theme="ar"] .nd-plane .qc-btns .nd-btn:not(.nd-btn--outline){ color:#0B0E14 !important; }
html[data-theme="ar"] .nd-btn, html[data-theme="ar"] .nd-nav .nd-btn{ background:var(--ar-btn) !important; }
html[data-theme="ar"] .nd-plane .fc-input:focus{ border-color:#FFF83F !important; box-shadow:0 0 0 3px rgba(255,248,63,.3) !important; }
.ar-contact__side .ar-list--sm li::before{ background:#FFF83F; color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .ct-ok{ background:#FFF83F !important; color:#0B0E14 !important; box-shadow:0 0 0 4px rgba(255,248,63,.2); }
/* founder 2026-10-30: button yellow is #FFF83F */
html[data-theme="ar"], .ar{ --ar-btn:#FFF83F; --ar-btn-hi:#FFFA7A; --ar-btn-ink:#0B0E14; }
.ar-call__arrow{ background:#F4EC2F !important; }
.ar-call:hover .ar-call__arrow{ background:#FFF83F !important; }
html[data-theme="ar"] .nd-plane .fc-input:focus{ border-color:#FFF83F !important; box-shadow:0 0 0 3px rgba(255,248,63,.3) !important; }
.ar-contact__side .ar-list--sm li::before{ background:#FFF83F; }
html[data-theme="ar"] .nd-plane .ct-ok{ background:#FFF83F !important; box-shadow:0 0 0 4px rgba(255,248,63,.2); }

/* page intro rules live inline in index.html (2026-10-31) so they apply at first paint */

/* seals: solid, crisp, bigger (founder circled the dim blurry ones) */
.ar-badge__seal{ width:56px !important; height:56px !important; background:#1F49E6 !important; color:#fff !important; box-shadow:0 10px 30px -10px rgba(31,73,230,.8) !important; }
.ar-badge__seal svg{ width:30px !important; height:30px !important; }
.ar-badge__seal svg path:last-child{ fill:#1F49E6; }
.ar-badge--dr .ar-badge__seal{ background:#FFF83F !important; color:#0B0E14 !important; box-shadow:0 10px 30px -10px rgba(255,248,63,.6) !important; }
.ar-badge--dr .ar-badge__seal svg path:first-child{ fill:#0B0E14; }
.ar-badge--dr .ar-badge__seal svg path:last-child{ fill:#FFF83F; }
/* team page: "Where Guljar fits" in one row (founder 2026-10-30): text left, the terms right */
@media (min-width:900px){
  html[data-theme="ar"] .nd-pg-team .nd-container:has(#tm-project-h){ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(32px,5vw,72px); align-items:center; }
  html[data-theme="ar"] .nd-pg-team .nd-container:has(#tm-project-h) .nd-shead{ text-align:left; margin:0; max-width:none; }
  html[data-theme="ar"] .nd-pg-team .nd-container:has(#tm-project-h) .nd-shead .nd-h2, html[data-theme="ar"] .nd-pg-team .nd-container:has(#tm-project-h) .nd-lead{ margin-left:0 !important; margin-right:0 !important; text-align:left; }
  html[data-theme="ar"] .nd-pg-team .tm-terms{ margin:0 !important; max-width:none !important; padding:28px 30px; border-radius:24px; background:#141418; border:1px solid rgba(255,255,255,.1); }
}
/* navbar a little more transparent (founder 2026-10-30) */
html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ background:rgba(10,10,13,.32) !important; backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2); }
/* outline buttons on dark pages: transparent with a hairline, never yellow-on-yellow */
html[data-theme="ar"] .nd-btn--outline, html[data-theme="ar"] .nd-btn--outline span{ background:transparent !important; color:#FFFFFF !important; border:1px solid rgba(255,255,255,.28) !important; }
html[data-theme="ar"] .nd-btn--outline:hover{ background:rgba(255,255,255,.08) !important; color:#FFFFFF !important; }
html[data-theme="ar"] .nd-plane .qc-btns .nd-btn--outline, html[data-theme="ar"] .nd-plane .qc-btns .nd-btn--outline span{ color:#0B0E14 !important; border-color:rgba(11,14,20,.2) !important; background:#fff !important; }

/* team page proof strip: dark like the rest of the site (it kept the light wash + white tiles) */
html[data-theme="ar"] .nd-plane section.ps-sec, html[data-theme="ar"] .nd-plane section.ps-sec.nd-grad-wash{ background:#0A0A0D !important; color:#fff !important; }
html[data-theme="ar"] .nd-plane .ps-sec::before, html[data-theme="ar"] .nd-plane .ps-sec::after{ display:none !important; }
html[data-theme="ar"] .nd-plane .ps-sec .nd-h2, html[data-theme="ar"] .nd-plane .ps-sec .nd-lead{ color:#fff !important; }
html[data-theme="ar"] .nd-plane .ps-sec .nd-lead{ color:#A3A8B3 !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-card{ background:#141418 !important; border:1px solid rgba(255,255,255,.1) !important; box-shadow:none !important; color:#fff !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-card .ps-num{ color:#fff !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-card .ps-lab, html[data-theme="ar"] .nd-plane .ps-sec .ps-route__lab, html[data-theme="ar"] .nd-plane .ps-sec .ps-time__labs{ color:#A3A8B3 !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-quote{ background:#141418 !important; border:1px solid rgba(255,255,255,.1) !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-verified, html[data-theme="ar"] .nd-plane .ps-sec .ps-live{ background:#1F1F26 !important; color:#fff !important; border:1px solid rgba(255,255,255,.14) !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-verified *, html[data-theme="ar"] .nd-plane .ps-sec .ps-live *{ color:#fff !important; }
html[data-theme="ar"] .nd-plane .ps-sec .ps-who, html[data-theme="ar"] .nd-plane .ps-sec .ps-q{ color:#fff !important; }

/* home pricing in the terms layout (founder 2026-10-30); industries image on the right so the two row sections alternate */
.ar-terms__prices li{ grid-template-columns:40px minmax(0,1fr) auto !important; }
.ar-terms__prices li span small{ display:block; margin-top:2px; font-size:13px; color:var(--ar-mute); }
.ar-terms__prices li b{ font-size:clamp(18px,1.5vw,22px); font-weight:600; letter-spacing:-.02em; white-space:nowrap; }
@media (min-width:900px){ .ar-rows--flip .ar-rows__media{ order:2; } .ar-rows--flip{ grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr) !important; } }
/* nav: no bottom line, more transparent (founder 2026-10-30) */
html[data-theme="ar"] .nd-nav, html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ border-bottom:0 !important; box-shadow:none !important; background:rgba(10,10,13,.18) !important; }
html[data-theme="ar"] .nd-nav::after, html[data-theme="ar"] .nd-nav-bar::after, html[data-theme="ar"] .nd-nav-bar::before{ display:none !important; }
/* pricing "Start now" pills yellow (founder 2026-10-30) */
.ar-plan .ar-pill-w{ background:#FFF83F !important; color:#0B0E14 !important; }
.ar-plan .ar-pill-w:hover{ background:#FFFA7A !important; }
/* nav at the top of the page: fully transparent, no blur edge; the tint appears only once scrolled */
html[data-theme="ar"] .nd-nav:not(.is-scrolled) .nd-nav-bar{ background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
/* page -> footer blend (founder 2026-10-30: "this gradient should blend well"): footer base is transparent so the
   section halos run under it, no dark fade band above it, and the bottom glow rises softly. */
html[data-theme="ar"], html[data-theme="ar"] body{ background:#0A0A0D; }
.ar.ar-pg::after{ display:none !important; }
html[data-theme="ar"] .nd-ft{ background:radial-gradient(90% 85% at 50% 118%, rgba(86,78,255,.72) 0%, rgba(110,61,245,.4) 30%, rgba(31,73,230,.14) 58%, rgba(10,10,13,0) 82%) !important; }
.ar.ar-pg{ overflow:visible; }
.ar .ar-s-cta{ overflow:visible; }
html[data-theme="ar"] .nd-ft{ background:radial-gradient(95% 95% at 50% 112%, rgba(86,78,255,.78) 0%, rgba(110,61,245,.46) 30%, rgba(31,73,230,.16) 58%, rgba(10,10,13,0) 80%) !important; }
/* founder 2026-10-30: "remove navbar border" — nothing on the nav draws a line or shadow */
html[data-theme="ar"] .nd-nav, html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav .nd-container, html[data-theme="ar"] .nd-nav-inner, html[data-theme="ar"] .nd-nav-links{ border:0 !important; box-shadow:none !important; outline:0 !important; }
/* seal: glyph dead-centre (founder: "still not align") */
.ar-badge__seal{ display:flex !important; align-items:center !important; justify-content:center !important; margin:0 auto 14px !important; line-height:0; }
.ar-badge__seal svg{ display:block; margin:0; }
/* nav tint when scrolled, site-wide: lighter still (founder: "more transparent") */
html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ background:rgba(10,10,13,.12) !important; }
/* contact: inline Calendly (founder pasted the embed, 2026-10-30) */
.ar-calendly{ margin-top:clamp(28px,4vw,48px); border-radius:28px; overflow:hidden; background:#fff; border:1px solid rgba(255,255,255,.1); min-height:700px; }
.ar-calendly > div{ min-width:320px; }

/* =================================================================================================
   RESPONSIVE PASS 2026-10-31 (founder: "on mobile we are very very bad, need perfect like them").
   Reference: arounda.agency at 390px — 18px gutters, everything left-aligned, one column, big but
   not huge headlines (36-40px), full-width pills, logo grids 2-up, generous vertical rhythm, no
   horizontal overflow anywhere. Tablet (641-1023px) is two columns where desktop has three.
   ================================================================================================= */
html[data-theme="ar"], html[data-theme="ar"] body{ overflow-x:clip; }
.ar img, .ar video, .ar iframe{ max-width:100%; }

/* ---------- tablet ---------- */
@media (max-width:1023px){
  .ar .nd-container{ padding-left:28px !important; padding-right:28px !important; }
  .ar-cards, .ar-blog, .ar-aud, .ar-svc__grid, .ar-lgrid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .ar-ph__grid, .ar-contact, .ar-terms, .ar-why, .ar-rows, .ar-faq-wrap, .ar-fstats, .ar-works{ grid-template-columns:1fr !important; }
  .ar-works__side{ display:flex; flex-wrap:wrap; gap:8px 24px; align-items:center; }
  .ar-works__side h4{ width:100%; margin:10px 0 2px; }
  .ar-works__side .ar-rail{ display:flex; flex-wrap:wrap; gap:8px; }
  .ar-works__side .ar-rail li{ border:0 !important; }
  .ar-works__side .ar-rail button{ padding:8px 14px !important; border-radius:999px; background:rgba(255,255,255,.06); }
  .ar-works__side .ar-call{ width:100%; margin-top:16px; }
  .ar-plan-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .ar-stack .ar-case__text{ max-width:none !important; }
}

/* ---------- phone ---------- */
@media (max-width:640px){
  .ar .nd-container{ padding-left:18px !important; padding-right:18px !important; }
  .ar-sec{ padding:52px 0 !important; }
  /* type: left-aligned, arounda sizes */
  .ar-h--xl{ font-size:40px !important; line-height:1.08 !important; }
  .ar-h--l{ font-size:34px !important; line-height:1.1 !important; }
  .ar-h--m{ font-size:26px !important; }
  .ar-center, .ar-head.ar-center, .ar-sub.ar-center, .ar-hero__eyebrow, .ar-hero__h, .ar-cta, .ar-logos__t{ text-align:left !important; }
  .ar-head.ar-center .ar-h, .ar-head.ar-center .ar-sub, .ar-cta .ar-sub, .ar-cta .ar-h{ margin-left:0 !important; margin-right:0 !important; }
  .ar-sub{ font-size:16px !important; line-height:1.55 !important; }
  .ar-eyebrow{ font-size:11px; }
  /* hero */
  .ar-hero{ padding-top:36px !important; }
  .ar-hero__h{ font-size:40px !important; line-height:1.1 !important; max-width:none !important; }
  .ar-hero__eyebrow{ font-size:15px !important; margin-bottom:16px !important; }
  .ar-hero__thumb{ width:2.2em; height:1.5em; display:inline-flex; vertical-align:middle; }
  .ar-hero__row{ gap:22px !important; margin-top:28px !important; }
  .ar-hero__cta{ width:100%; justify-self:stretch !important; }
  .ar-hero__cta .ar-call, .ar-call{ display:flex; width:100%; }
  .ar-call__main{ flex:1 1 auto; justify-content:center; text-align:center; }
  .ar-ph__actions{ flex-direction:column; align-items:stretch; gap:14px; }
  .ar-ph__actions .ar-ph__clutch{ justify-content:flex-start; }
  /* grids go single column */
  .ar-cards, .ar-blog, .ar-aud, .ar-svc__grid, .ar-wgrid, .ar-plan-grid, .ar-price, .ar-proof, .ar-stats, .ar-band, .ar-awards, .ar-cat-grid, .ar-model, .ar-bignums, .ar-mosaic, .ar-principles, .ar-lead, .ar-story, .ar-person, .ar-kpis, .ar-row-case, .ar-aud{ grid-template-columns:1fr !important; }
  .ar-lgrid, .ar-logos__row, .ar-proof__logos, .ar-badges, .ar-ver{ grid-template-columns:1fr 1fr !important; gap:10px !important; }
  .ar-badges{ gap:10px !important; } .ar-badge{ padding:22px 14px 20px !important; border-radius:18px !important; } .ar-badge b{ font-size:34px !important; }
  .ar-badge__seal{ width:44px !important; height:44px !important; margin-bottom:10px !important; } .ar-badge__seal svg{ width:22px !important; height:22px !important; }
  /* rows (tools / industries): label above chips, chips scroll */
  .ar-row{ flex-direction:column !important; align-items:flex-start !important; gap:10px !important; padding:18px 0 !important; }
  .ar-row b{ font-size:20px !important; }
  .ar-row .ar-chips{ justify-content:flex-start !important; }
  .ar-rows__media{ padding:12px !important; border-radius:18px !important; }
  .ar-rows__head{ grid-template-columns:1fr !important; gap:12px !important; } .ar-rows__head .ar-g{ display:none; } .ar-rows__head .ar-sub{ grid-column:1 !important; }
  /* lists */
  .ar-terms li, .ar-why__list li, .ar-list li{ grid-template-columns:28px minmax(0,1fr) !important; gap:12px !important; padding:16px 0 !important; font-size:16px !important; }
  .ar-terms__prices li{ grid-template-columns:28px minmax(0,1fr) auto !important; } .ar-terms__prices li b{ font-size:17px !important; }
  /* stats */
  .ar-stat{ padding-top:60px !important; } .ar-stat__n{ font-size:64px !important; }
  /* cards / quote / cta */
  .ar-card{ padding:22px !important; border-radius:18px !important; }
  .ar-quote{ padding:24px 20px !important; border-radius:20px !important; } .ar-quote p{ font-size:19px !important; line-height:1.4 !important; }
  .ar-cta{ padding:40px 20px !important; border-radius:24px !important; } .ar-cta .ar-call{ margin-top:24px !important; }
  .ar-svc{ padding:10px !important; } .ar-svc__col{ padding:18px 18px 6px !important; } .ar-svc__col h3{ font-size:22px !important; padding-bottom:14px !important; } .ar-svc__col a{ padding:16px 0 !important; font-size:16px !important; }
  .ar-founder, .ar-fbar{ padding:20px !important; border-radius:20px !important; } .ar-fbar__t{ font-size:18px !important; }
  /* case stack */
  .ar-stack{ gap:56px !important; } .ar-stack .ar-case{ gap:18px !important; }
  .ar-stack .ar-case__text h3{ font-size:24px !important; } .ar-stack .ar-case__text p{ font-size:15px !important; }
  .ar-stack .ar-plate, .ar-stack .ar-plate.is-video{ border-radius:16px !important; }
  /* works page */
  .ar-works{ gap:20px !important; } .ar-wtile h3{ font-size:18px !important; } .ar-feat{ padding:10px !important; border-radius:20px !important; }
  .ar-feat__cap{ flex-direction:column; align-items:flex-start; gap:10px; }
  /* pricing */
  .ar-toggle{ width:100% !important; justify-content:center; flex-wrap:wrap; } .ar-toggle button{ height:38px !important; padding:0 14px !important; font-size:14px !important; }
  .ar-plan{ padding:22px 18px 16px !important; border-radius:20px !important; } .ar-plan__price{ font-size:38px !important; } .ar-plan__sep{ margin:18px -18px 4px !important; }
  /* contact */
  .ar-contact{ gap:14px !important; } .ar-contact__side{ padding:22px !important; } .ar-form{ padding:22px 18px !important; } .ar-form__row{ grid-template-columns:1fr !important; }
  .ar-form h2{ font-size:28px !important; }
  /* compare table scrolls inside its box */
  html[data-theme="ar"] .nd-plane .ct-wrap{ padding:4px !important; border-radius:18px !important; }
  html[data-theme="ar"] .nd-plane .ct-table th, html[data-theme="ar"] .nd-plane .ct-table td{ padding:14px 14px !important; font-size:14px !important; }
  /* footer */
  html[data-theme="ar"] .nd-ft .nd-container{ padding-left:18px !important; padding-right:18px !important; }
  /* faq */
  .ar-faq summary{ font-size:17px !important; padding:18px 0 !important; } .ar-faq p{ font-size:15px !important; }
  /* blog cards */
  .hl-card__img{ border-radius:14px !important; }
  /* glows smaller so they don't paint a solid wash on a narrow screen */
  .ar-sec::before, .ar-sec::after, .ar-glow-l::before, .ar-glow-r::before, .ar-glow-v::before{ opacity:.6 !important; }
}
/* phone + tablet nav: 72px bar, compact Contact pill, the hamburger stays on screen (it sat at x=396 on a 390px phone) */
@media (max-width:1023px){
  html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ height:72px !important; }
  html[data-theme="ar"]{ --nd-nav-h:72px; }
  html[data-theme="ar"] .nd-nav-bar .nd-container{ display:flex !important; align-items:center; justify-content:space-between; gap:10px; padding-left:18px !important; padding-right:18px !important; }
  html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta, html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta:hover{ height:40px !important; padding:0 16px !important; font-size:14px !important; gap:0 !important; margin-left:auto; }
  html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta i{ display:none !important; }
  html[data-theme="ar"] .nd-nav-menu{ color:#FFFFFF !important; flex:0 0 auto; margin:0 !important; }
  html[data-theme="ar"] .nd-nav-sheet{ padding-top:88px !important; }
  html[data-theme="ar"] .nd-nav-sheet li a{ font-size:22px !important; min-height:56px !important; border-bottom:1px solid rgba(255,255,255,.08); }
  html[data-theme="ar"] .nd-nav-sheet ul{ border-top:0 !important; }
  html[data-theme="ar"] .nd-nav-sheet .nd-btn{ background:#FFF83F !important; color:#0B0E14 !important; height:52px !important; border-radius:999px !important; }
  html[data-theme="ar"] .nd-nav-sheet .nd-phone-services li a{ font-size:16px !important; min-height:44px !important; color:#C9CDD6 !important; border:0 !important; }
  html[data-theme="ar"] .nd-wordmark, html[data-theme="ar"] .nd-nav-brand{ font-size:18px !important; }
}
@media (max-width:1023px){ html[data-theme="ar"] .nd-nav-bar, html[data-theme="ar"] .nd-nav.is-scrolled .nd-nav-bar{ padding-top:0 !important; } }
/* phone: fixed nav must not cover page tops; every table scrolls inside its own box; sheet CTA yellow */
@media (max-width:1023px){
  html[data-theme="ar"] .nd-pg-work .cf-hero, html[data-theme="ar"] .nd-plane .nd-hero, html[data-theme="ar"] .ar-ph, html[data-theme="ar"] .ar-hero{ padding-top:calc(var(--nd-nav-h,72px) + 28px) !important; }
  html[data-theme="ar"] .nd-nav .nd-nav-sheet a.nd-btn, html[data-theme="ar"] .nd-nav-sheet a.nd-btn{ background:#FFF83F !important; color:#0B0E14 !important; }
}
@media (max-width:760px){
  html[data-theme="ar"] .nd-plane table, html[data-theme="ar"] .ar table{ display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  html[data-theme="ar"] .nd-plane .ct-table{ min-width:640px !important; }
}
/* phone pass, round 2: article column, team grids, mosaic */
@media (max-width:767px){
  .hl-grid{ grid-template-columns:minmax(0,1fr) !important; }
  .hl-grid > *, .hl-toc, .hl-toc__in, .hl-ask, .hl-art .nd-plane{ width:auto !important; max-width:100% !important; min-width:0 !important; }
  .hl-toc{ position:static !important; }
  .hl-art .nd-plane{ overflow-wrap:anywhere; }
  .hl-art .nd-plane img, .hl-art .nd-plane figure{ max-width:100% !important; height:auto; }
}
@media (max-width:640px){
  .ar-mosaic{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px !important; }
  .ar-mosaic li a{ border-radius:14px !important; } .ar-mosaic li span{ display:none; }
  .ar-lead__big{ aspect-ratio:4/5 !important; }
  html[data-theme="ar"] .nd-pg-team .tm-grid .nd-grid-4 > li{ width:calc((100% - 12px) / 2) !important; }
  html[data-theme="ar"] .nd-pg-team .tm-grid .nd-grid-4{ gap:12px !important; }
  html[data-theme="ar"] .nd-pg-team .nd-person img{ width:100%; aspect-ratio:4/5; object-fit:cover; height:auto; border-radius:14px; }
  html[data-theme="ar"] .nd-pg-team .nd-person p{ display:none; }
  html[data-theme="ar"] .nd-pg-team .nd-person b{ font-size:15px; } html[data-theme="ar"] .nd-pg-team .nd-person span{ font-size:12px; }
}
/* container: the 24px side margin doubled the gutter on small screens (24 + 18 = 42). Width is the viewport, gutter is the padding. */
@media (max-width:1023px){ .ar .nd-container, html[data-theme="ar"] .nd-nav-bar .nd-container, html[data-theme="ar"] .nd-ft .nd-container, html[data-theme="ar"] .nd-plane .nd-container{ margin-left:0 !important; margin-right:0 !important; width:100% !important; max-width:100% !important; } }
/* phone nav: mark only (founder 2026-10-31 "on mobile navbar only logo icon is enough") */
@media (max-width:640px){ html[data-theme="ar"] .nd-nav-brand .nd-wordmark{ display:none !important; } html[data-theme="ar"] .nd-nav-brand{ gap:0 !important; } }
/* case page on phones: hero starts below the fixed nav, chapter rail hidden (it was a 422px sticky bar on a 390px screen) */
@media (max-width:1023px){
  html[data-theme="ar"] .nd-pg-work .cf-hero{ margin-top:0 !important; padding-top:calc(var(--nd-nav-h,72px) + 28px) !important; }
  html[data-theme="ar"] .nd-pg-work .cf-rail{ display:none !important; }
}

/* ---------- legacy "plane" pages (/b2b, /aruba, /faqs, team-details) under the dark theme (founder 2026-10-31:
   "this problem need to solve completely wherever this is"): light panels get ink text, dark panels get white,
   gradient-filled numbers get a white fill, serif accents inside light panels go violet. ---------- */
html[data-theme="ar"] .nd-plane .ps-sec .ps-num, html[data-theme="ar"] .nd-plane .ps-sec .ps-head .ps-chrome, html[data-theme="ar"] .nd-plane .ps-sec.nd-grad-wash .ps-num{
  color:#fff !important; background:linear-gradient(180deg,#FFFFFF 0%,#FFFFFF 45%,#B9BEC9 100%) !important; -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important; }
html[data-theme="ar"] .nd-plane .b2b-build .bb-card, html[data-theme="ar"] .nd-plane .b2b-build .bb-card :is(p,li,span,b,strong,h3,h4,small){ color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .b2b-build .bb-card a{ color:#1F49E6 !important; }
html[data-theme="ar"] .nd-plane .bd-side, html[data-theme="ar"] .nd-plane .bd-side :is(p,li,span,b,strong,h2,h3,h4,dt,dd,small){ color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .bd-side .nd-serif-accent{ color:#6E3DF5 !important; }
html[data-theme="ar"] .nd-plane .bd-side .nd-eyebrow{ background:#0B0E14 !important; color:#fff !important; }
html[data-theme="ar"] .nd-plane .bd-side .bd-stats > *{ background:rgba(255,255,255,.7) !important; color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .bd-side .nd-btn, html[data-theme="ar"] .nd-plane .bd-side a.nd-btn{ background:#FFF83F !important; color:#0B0E14 !important; }
html[data-theme="ar"] .nd-plane .bd-list :is(b,strong,h3){ color:#fff !important; } html[data-theme="ar"] .nd-plane .bd-list p{ color:#C9CDD6 !important; }
html[data-theme="ar"] .nd-plane .qc .qc-panel h2 .nd-serif-accent, html[data-theme="ar"] .nd-plane .qc-panel .nd-serif-accent, html[data-theme="ar"] .nd-plane .qc-panel .qc-h .nd-serif-accent{ color:#6E3DF5 !important; -webkit-text-fill-color:#6E3DF5 !important; }
html[data-theme="ar"] .nd-plane .qc-panel .nd-btn:not(.nd-btn--outline){ background:#FFF83F !important; color:#0B0E14 !important; }
/* any white or light card inside the plane system reads ink */
html[data-theme="ar"] .nd-plane :is(.nd-card2, .bb-card, .hp-card, .nd-icol, .aj-card, .ap-card, .ai-card, .ac-card){ color:#0B0E14; }
html[data-theme="ar"] .nd-plane .nd-card2:where( .is-light){ color:#0B0E14 !important; }
/* terms (text left) then pricing (text right): the two list sections alternate (founder 2026-10-31) */
@media (min-width:1024px){ .ar-terms--flip{ grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) !important; } .ar-terms--flip > div:first-child{ order:2; } .ar-terms--flip > ul{ order:1; } }
/* about team band on phones: 4 across, spacer cells hidden (one column made each spacer a full-width dark square) */
@media (max-width:640px){ .ar-band{ grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:8px !important; -webkit-mask-image:none !important; mask-image:none !important; } .ar-band__empty{ display:none !important; } .ar-band > *{ border-radius:12px !important; } }
/* plane pages (solutions index etc.) read left on phones like the rest */
@media (max-width:640px){ html[data-theme="ar"] .nd-plane .nd-shead, html[data-theme="ar"] .nd-plane .nd-phero, html[data-theme="ar"] .nd-plane .nd-shead .nd-lead{ text-align:left !important; margin-left:0 !important; } html[data-theme="ar"] .nd-plane .nd-shead .nd-h2, html[data-theme="ar"] .nd-plane .nd-shead .nd-lead, html[data-theme="ar"] .nd-plane .nd-phero .nd-lead{ margin-left:0 !important; margin-right:0 !important; } }
/* tablet round 2 */
@media (max-width:1023px){
  html[data-theme="ar"] .nd-plane .ct-wrap{ overflow-x:auto !important; }
  html[data-theme="ar"] .nd-pg-work .cf-ledger{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  html[data-theme="ar"] .nd-pg-work .cf-ledger__wide{ grid-column:1 / -1 !important; }
  .ar-plan-grid--1{ grid-template-columns:1fr !important; }
  html[data-theme="ar"] .nd-nav-sheet{ background:#0A0A0D !important; color:#fff !important; }
  html[data-theme="ar"] .nd-nav-sheet a, html[data-theme="ar"] .nd-nav-sheet summary{ color:#fff !important; }
}
/* case + plane heroes on phones: natural height, never a fixed viewport box centring an overflowing child */
@media (max-width:1023px){
  html[data-theme="ar"] .nd-plane .nd-phero, html[data-theme="ar"] .nd-pg-work .cf-hero{ height:auto !important; min-height:0 !important; max-height:none !important; display:block !important; justify-content:flex-start !important; align-items:flex-start !important; padding-top:calc(var(--nd-nav-h,72px) + 24px) !important; padding-bottom:40px !important; }
  html[data-theme="ar"] .nd-plane .nd-phero .nd-container, html[data-theme="ar"] .nd-pg-work .cf-hero .nd-hero-c{ height:auto !important; min-height:0 !important; }
  html[data-theme="ar"] .nd-pg-work .cf-hero .cf-ledger{ margin-top:22px !important; }
}
/* about quote card on phones: full width, not clipped */
@media (max-width:640px){ .ar-quote, .ar-row-case blockquote{ overflow:visible !important; max-width:100% !important; } .ar-row-case__text{ min-width:0; } }
/* phones: every table lives in a scroll box; no copy under 13px */
@media (max-width:767px){
  html[data-theme="ar"] main table{ display:block !important; width:100% !important; max-width:100% !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch; }
  html[data-theme="ar"] main table thead, html[data-theme="ar"] main table tbody, html[data-theme="ar"] main table tr{ display:table; width:max-content; min-width:100%; }
  html[data-theme="ar"] main table th, html[data-theme="ar"] main table td{ white-space:normal; min-width:140px; font-size:14px !important; }
  html[data-theme="ar"] .hl-card__meta, html[data-theme="ar"] .ar-float, html[data-theme="ar"] .nd-plane .ps-url, html[data-theme="ar"] .nd-plane .ps-live, html[data-theme="ar"] .nd-pg-team .nd-person span{ font-size:13px !important; }
}
@media (max-width:767px){ html[data-theme="ar"] main table, html[data-theme="ar"] .nd-plane .ct-table{ min-width:0 !important; } html[data-theme="ar"] main .nd-tblwrap, html[data-theme="ar"] main .ct-wrap{ overflow-x:auto !important; max-width:100%; } }
/* intro, first paint: the pre-split home headline animates from frame one; everything else on the
   page fades up. Without JS (or for bots) html.ar-intro is never set and the page is simply there. */

/* ---------- 2026-11-01 round ---------- */
/* no white flash while a lazy route chunk loads: the shell is dark at every layer */
html[data-theme="ar"], html[data-theme="ar"] body, html[data-theme="ar"] #smooth-wrapper, html[data-theme="ar"] #smooth-content, html[data-theme="ar"] main.bg-neutral-0, html[data-theme="ar"] main{ background:#0A0A0D !important; }
/* laurel awards (replace the two seal cards) */
.ar-awards{ display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:16px; max-width:1100px; margin:clamp(40px,5vw,64px) auto 0; }
.ar-award{ display:flex; flex-direction:column; align-items:center; gap:14px; padding:26px 12px 22px; border-radius:20px; text-decoration:none; color:#fff; transition:background .3s; }
.ar-award:hover{ background:rgba(255,255,255,.05); }
.ar-award__top{ display:flex; align-items:center; gap:6px; }
.ar-award__laurel{ color:#C9CDD6; flex:0 0 auto; } .ar-award__laurel--r{ transform:scaleX(-1); }
.ar-award__mark{ display:flex; flex-direction:column; align-items:center; gap:6px; min-width:96px; }
.ar-award__mark b{ font-family:var(--ar-display); font-size:26px; font-weight:600; letter-spacing:-.02em; line-height:1; color:#fff; }
.ar-award--designrush .ar-award__mark b{ font-size:20px; }
.ar-award__mark .ar-stars{ font-size:12px; letter-spacing:.14em; color:#FFF83F; }
.ar-award__line{ display:flex; flex-direction:column; align-items:center; text-align:center; font-size:14px; line-height:1.35; color:#D7DAE1; }
@media (max-width:900px){ .ar-awards{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; } }
/* b2b: highlighted price row readable, promise cards visible, card icons on cobalt */
html[data-theme="ar"] .nd-plane .qc-row.is-hi, html[data-theme="ar"] .nd-plane .qc-row.is-hi *{ color:#FFFFFF !important; }
html[data-theme="ar"] .nd-plane .qc-row.is-hi small{ color:rgba(255,255,255,.8) !important; }
html[data-theme="ar"] .nd-plane .hp-how .nd-icol{ background:#141418 !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:24px; padding:28px 24px !important; }
html[data-theme="ar"] .nd-plane .hp-how .nd-icol :is(h3,b,strong){ color:#fff !important; } html[data-theme="ar"] .nd-plane .hp-how .nd-icol p{ color:#C9CDD6 !important; }
html[data-theme="ar"] .nd-plane .b2b-build .bb-card .nd-tile{ background:linear-gradient(160deg,#6B9BFF 0%,#1F49E6 55%,#12309E 100%) !important; color:#fff !important; border-radius:14px; }
html[data-theme="ar"] .nd-plane .b2b-build .bb-card .nd-tile svg{ color:#fff; stroke:#fff; }
/* home pricing cards (the real plan cards) */
.ar-plans--home{ margin-top:clamp(36px,5vw,56px) !important; }
.ar-plans--home .ar-plan-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.ar-price__foot{ margin-top:28px; } .ar-price__foot a{ color:#fff; text-decoration:underline; text-underline-offset:.25em; }
/* selected work: tighter end */
.ar-s-work{ padding-bottom:48px !important; } .ar-s-work .ar-center{ margin-top:8px !important; }
/* laurel awards sit on the page like arounda's: no card box (the older .ar-awards > a rule boxed them) */
.ar-awards > a.ar-award{ background:transparent !important; border:0 !important; min-height:0 !important; padding:22px 10px !important; justify-content:flex-start !important; gap:14px !important; }
.ar-awards > a.ar-award:hover{ background:rgba(255,255,255,.05) !important; }
.ar-awards > a.ar-award b{ font-size:26px; }

/* ---------- 2026-11-02: logo strip without white tiles (founder). Logos go monochrome white on the dark
   page like arounda's partner row: dark marks on white are inverted, so every logo reads as one tone. ---------- */
.ar-logos__row span, .ar-logos__track span{ background:transparent !important; border:0 !important; padding:8px 14px !important; height:64px !important; }
.ar-logos__row img, .ar-logos__track img{ filter:grayscale(1) invert(1) brightness(1.15) contrast(1.05); max-height:34px !important; opacity:.92; mix-blend-mode:screen; }
.ar-logos__track .ar-logo-text, .ar-logos__row .ar-logo-text{ color:#fff !important; opacity:.92; }
.ar-logos{ border-color:rgba(255,255,255,.08) !important; }
/* blog post: CTA band after the lead, author box at the end (founder 2026-11-02: "3 CTA per blog, new author box") */
.hl-band{ display:flex; align-items:center; justify-content:space-between; gap:24px; margin:26px 0 30px; padding:22px 26px; border-radius:22px; background:linear-gradient(135deg, rgba(31,73,230,.35), rgba(110,61,245,.25)); border:1px solid rgba(255,255,255,.12); }
.hl-band b{ display:block; font-size:18px; color:#fff; } .hl-band span{ display:block; margin-top:4px; font-size:14px; color:#D7DAE1; line-height:1.45; }
.hl-band .ar-call{ flex:0 0 auto; }
.hl-authorbox{ display:grid; grid-template-columns:96px minmax(0,1fr); gap:22px; align-items:start; margin-top:28px; padding:28px; border-radius:24px; background:#141418; border:1px solid rgba(255,255,255,.1); }
.hl-authorbox img{ width:96px; height:96px; border-radius:50%; object-fit:cover; }
.hl-authorbox b{ display:block; font-size:22px; color:#fff; margin-top:6px; } .hl-authorbox__role{ display:block; font-size:14px; color:var(--ar-mute); margin-top:2px; }
.hl-authorbox p{ margin-top:12px; font-size:15px; line-height:1.55; color:#C9CDD6; }
.hl-authorbox__links{ display:flex; flex-wrap:wrap; gap:16px; margin-top:14px; } .hl-authorbox__links a{ color:#fff; font-size:14px; text-decoration:underline; text-underline-offset:.25em; }
@media (max-width:640px){ .hl-band{ flex-direction:column; align-items:stretch; } .hl-authorbox{ grid-template-columns:1fr; } .hl-authorbox img{ width:72px; height:72px; } }
/* strip logos are pre-rendered white PNGs now: no CSS filter, uniform height, soft opacity */
.ar-logos__row img, .ar-logos__track img{ filter:none !important; mix-blend-mode:normal !important; max-height:30px !important; opacity:.9; }
.ar-logos__track span{ min-width:150px; }
/* awards, arounda-exact: filled laurels, bold wordmark, stars under it, bold two-line caption */
.ar-award__laurel{ width:34px; height:42px; color:#fff; }
.ar-award__top{ gap:2px !important; }
.ar-award__mark b{ font-size:30px !important; font-weight:700 !important; }
.ar-award--designrush .ar-award__mark b{ font-size:22px !important; }
.ar-award__mark .ar-stars{ font-size:13px !important; color:#fff !important; letter-spacing:.1em !important; }
.ar-award__mark svg{ width:34px; height:34px; }
.ar-award__line{ font-weight:600 !important; font-size:14px !important; color:#fff !important; }
.ar-award__laurel{ width:40px !important; height:50px !important; }
.ar-award__mark{ min-width:104px !important; }

/* ---------- 2026-11-03 phone design pass ---------- */
@media (max-width:640px){
  /* case cards read like arounda's: picture first, then the words; no prev/next arrows on a phone */
  .ar-stack .ar-case{ flex-direction:column-reverse !important; gap:16px !important; }
  .ar-stack .ar-case__nav, .ar-stack .ar-case__arrows{ display:none !important; }
  .ar-stack .ar-case__text .ar-chips{ margin-top:4px; }
  .ar-stack .ar-case__quote{ font-size:15px !important; }
  /* inner-page heroes align left like the home hero */
  .ar-ph .ar-h, .ar-ph .ar-sub, .ar-ph .ar-ph__actions, .ar-ph .ar-chips, .ar-ph .ar-ph__crumbs, .ar-ph .ar-ph__clutch{ text-align:left !important; justify-content:flex-start !important; margin-left:0 !important; margin-right:0 !important; }
  .ar-ph .ar-ph__grid{ text-align:left !important; }
  /* awards 2-up, compact */
  .ar-awards{ gap:4px 8px !important; } .ar-award__laurel{ width:30px !important; height:38px !important; } .ar-awards > a.ar-award{ padding:14px 4px !important; }
  .ar-award__mark b{ font-size:22px !important; } .ar-award__line{ font-size:12.5px !important; }
  /* section rhythm */
  .ar-sec{ padding:48px 0 !important; } .ar-head + *{ margin-top:22px; }
}
/* partner logo grids (about, portfolio, home proof) match the strip: white marks, no tiles */
.ar-lgrid > div, .ar-proof__logos > *{ background:transparent !important; border:1px solid rgba(255,255,255,.1) !important; }
.ar-lgrid img, .ar-proof__logos img{ filter:none; }
.ar-lgrid .ar-logo-text, .ar-proof__logos .ar-logo-text{ color:#fff !important; }
.ar-form .ar-form__h{ font-family:var(--ar-display); font-size:28px; font-weight:600; letter-spacing:-.02em; color:#0B0E14; margin:0 0 18px; }

/* ---------- 2026-11-05 mobile usability: 44px tap targets, no copy under 13px ---------- */
@media (max-width:1023px){
  .ar-case__more, .ar-link, .ar-ph__clutch, .ar-price__foot a, .hl-authorbox__links a, .ar-row-case__link, .ar-case__link{ display:inline-flex !important; align-items:center; min-height:44px !important; padding-top:6px; padding-bottom:6px; }
  .ar-ph__crumbs a, .ar-ph__crumbs span{ display:inline-flex; align-items:center; min-height:40px; }
  .ar-eyebrow, .ar-award__line, .ar-hero__eyebrow, .ar-tier__p, .ar-plan__note, .ar-logos__t, .ar-badge__what, .hl-hero__meta span{ font-size:13px !important; }
  .ar-awards .ar-stars, .ar-award__mark .ar-stars{ font-size:13px !important; }
  html[data-theme="ar"] .nd-ft a{ display:inline-flex; align-items:center; min-height:40px; }
}
/* 404 (2026-11-05) */
.ar-404{ min-height:calc(100vh - var(--nd-nav-h,104px)); display:flex; align-items:center; padding-top:clamp(80px,12vh,140px) !important; }
.ar-404 .nd-container{ text-align:center; }
.ar-404__actions{ display:flex; justify-content:center; align-items:center; gap:22px; margin-top:32px; flex-wrap:wrap; }
.ar-404__chips{ justify-content:center; margin-top:28px; }
.ar-404 .ar-chip{ text-decoration:none; }
@media (max-width:640px){ .ar-404 .nd-container, .ar-404 .ar-h, .ar-404 .ar-sub{ text-align:center !important; } .ar-404__actions{ flex-direction:column; } }
/* route skeleton: dark shimmer placeholders while the next page's code loads */
.ar-skel{ position:fixed; left:0; right:0; top:var(--nd-nav-h,104px); bottom:0; z-index:900; background:#0A0A0D; padding-top:clamp(56px,8vh,110px); animation:ar-skel-in .18s ease both; }
@keyframes ar-skel-in{ from{ opacity:0; } to{ opacity:1; } }
.ar-skel__b{ display:block; border-radius:12px; background:linear-gradient(90deg, #141418 0%, #1E1E26 45%, #141418 90%); background-size:220% 100%; animation:ar-shimmer 1.3s ease-in-out infinite; }
@keyframes ar-shimmer{ from{ background-position:120% 0; } to{ background-position:-120% 0; } }
.ar-skel__eyebrow{ width:220px; height:14px; margin-bottom:26px; }
.ar-skel__h1{ width:min(820px,80%); height:56px; margin-bottom:14px; border-radius:16px; } .ar-skel__h1--2{ width:min(560px,60%); margin-bottom:28px; }
.ar-skel__p{ width:min(640px,70%); height:16px; margin-bottom:12px; } .ar-skel__p--2{ width:min(480px,55%); margin-bottom:30px; }
.ar-skel__row{ display:flex; gap:14px; margin-bottom:60px; } .ar-skel__pill{ width:230px; height:52px; border-radius:999px; background:linear-gradient(90deg,#3a3610,#5a5418 45%,#3a3610 90%); background-size:220% 100%; } .ar-skel__pill--ghost{ width:150px; background:linear-gradient(90deg,#141418,#1E1E26 45%,#141418 90%); background-size:220% 100%; }
.ar-skel__cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; } .ar-skel__card{ height:220px; border-radius:22px; }
@media (max-width:1023px){ .ar-skel{ top:72px; } .ar-skel__cards{ grid-template-columns:1fr; } .ar-skel__card{ height:160px; } .ar-skel__h1{ height:40px; width:92%; } .ar-skel__h1--2{ width:70%; } .ar-skel__row{ flex-direction:column; } .ar-skel__pill{ width:100%; } }
@media (prefers-reduced-motion:reduce){ .ar-skel__b, .ar-skel__pill{ animation:none; } }
@media (max-width:640px){ .ar-404__chips{ justify-content:center !important; } }

/* ---------- 2026-11-05 phone type and buttons: nothing under 13px, pills 44px+, tables stack as cards ---------- */
/* solutions hero: the secondary action is a ghost pill, not a bare link */
.ar-ph__actions .ar-pill-w{ display:inline-flex; align-items:center; justify-content:center; height:60px; padding:0 30px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2); color:#FFFFFF !important; font-weight:600; font-size:17px; text-decoration:none; transition:background .18s ease; }
.ar-ph__actions .ar-pill-w:hover{ background:rgba(255,255,255,.16); }
@media (max-width:1023px){
  html[data-theme="ar"] .ar .ar-eyebrow, html[data-theme="ar"] .ar-eyebrow, html[data-theme="ar"] .hl-toc h4, html[data-theme="ar"] .ar-ph__crumbs, html[data-theme="ar"] .ar-ph__crumbs a, html[data-theme="ar"] .ar-ph__crumbs span{ font-size:13px !important; }
  html[data-theme="ar"] .ar-stars, html[data-theme="ar"] .ar-quote__score small .ar-stars, html[data-theme="ar"] .ar-quote-card__foot .ar-stars, html[data-theme="ar"] .ar-awards .ar-stars, html[data-theme="ar"] .ar-plan__flag{ font-size:13px !important; }
  html[data-theme="ar"] .nd-plane .ct-table thead th{ font-size:13px !important; }
  html[data-theme="ar"] .nd-pg-work dt, html[data-theme="ar"] .nd-pg-work .cf-ch__n, html[data-theme="ar"] .nd-pg-work .cf-shot__n, html[data-theme="ar"] .nd-pg-work .cf-dec__n, html[data-theme="ar"] .nd-pg-work .cf-next__k{ font-size:13px !important; }
  html[data-theme="ar"] .nd-plane .ps-sec .ps-route__lab{ font-size:13px !important; }
}
@media (max-width:640px){
  /* nav: the Contact pill is a real tap target */
  html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta, html[data-theme="ar"] .nd-nav .nd-btn.ar-nav-cta:hover{ height:44px !important; padding:0 18px !important; font-size:15px !important; }
  /* the hero thumbnail label is too small to read on a phone; the link keeps its aria-label */
  .ar-hero__thumb b{ display:none !important; }
  /* call pill: one line, full width, arrow and text sized for a phone */
  .ar-call, .ar-hero__cta .ar-call, .ar-founder-card .ar-call, .hl-band .ar-call, .ar-toc .ar-call, .hl-toc .ar-call{ display:flex !important; width:100% !important; height:56px !important; }
  .ar-call__arrow{ flex:0 0 52px !important; width:52px !important; font-size:20px !important; }
  .ar-call__main{ flex:1 1 auto !important; min-width:0; justify-content:center !important; text-align:center; padding:0 14px !important; font-size:16px !important; white-space:nowrap; }
  .ar-ph__actions .ar-pill-w{ width:100%; height:56px; font-size:16px; }
}
@media (max-width:899px){
  /* tables stack as cards: the first cell is the title, every other cell shows its column name */
  html[data-theme="ar"] main .nd-tblwrap, html[data-theme="ar"] main .ct-wrap{ overflow:visible !important; }
  html[data-theme="ar"] main .nd-tblwrap table, html[data-theme="ar"] main .ct-table{ display:block !important; width:100% !important; min-width:0 !important; border-collapse:collapse; border:0 !important; background:transparent !important; }
  html[data-theme="ar"] main .nd-tblwrap thead, html[data-theme="ar"] main .ct-table thead{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  html[data-theme="ar"] main .nd-tblwrap tbody, html[data-theme="ar"] main .ct-table tbody{ display:block !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody tr, html[data-theme="ar"] main .ct-table tbody tr{ display:block !important; margin:0 0 12px !important; padding:6px 16px 8px !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:18px !important; background:rgba(255,255,255,.035) !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody tr > :first-child, html[data-theme="ar"] main .ct-table tbody tr > th[scope="row"]{ display:block !important; padding:10px 0 9px !important; border:0 !important; border-bottom:1px solid rgba(255,255,255,.1) !important; background:transparent !important; font-size:16px !important; font-weight:600 !important; color:#FFFFFF !important; text-align:left !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody td, html[data-theme="ar"] main .ct-table tbody td{ display:flex !important; flex-direction:column; gap:3px; padding:10px 0 !important; border:0 !important; border-bottom:1px solid rgba(255,255,255,.07) !important; background:transparent !important; font-size:15px !important; line-height:1.45 !important; color:#E4E6EB !important; text-align:left !important; white-space:normal !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody td:last-child, html[data-theme="ar"] main .ct-table tbody td:last-child{ border-bottom:0 !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody td[data-label]::before, html[data-theme="ar"] main .ct-table tbody td[data-label]::before{ content:attr(data-label); font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#8A90A0; }
  html[data-theme="ar"] main .nd-tblwrap tbody td.is-hi, html[data-theme="ar"] main .ct-table tbody td.is-us{ color:#FFFFFF !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody td.is-hi::before, html[data-theme="ar"] main .ct-table tbody td.is-us::before{ color:#9FB4FF; }
  html[data-theme="ar"] main .ct-table .ct-ok{ display:inline-flex; vertical-align:middle; margin-right:6px; }
}
@media (max-width:899px){
  /* undo the ≤767 scroll-table sizing inside the stacked cards */
  html[data-theme="ar"] main .nd-tblwrap table, html[data-theme="ar"] main .ct-table, html[data-theme="ar"] .hl-art .nd-plane table{ overflow:visible !important; white-space:normal !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody, html[data-theme="ar"] main .ct-table tbody, html[data-theme="ar"] main .nd-tblwrap tbody tr, html[data-theme="ar"] main .ct-table tbody tr{ width:auto !important; min-width:0 !important; max-width:100% !important; white-space:normal !important; }
  html[data-theme="ar"] main .nd-tblwrap tbody td, html[data-theme="ar"] main .ct-table tbody td, html[data-theme="ar"] main .nd-tblwrap tbody th, html[data-theme="ar"] main .ct-table tbody th{ min-width:0 !important; width:auto !important; position:static !important; }
  /* last labels under 13px */
  html[data-theme="ar"] .ar-quote-card__foot span, html[data-theme="ar"] .ar-tl em, html[data-theme="ar"] .hl-card__meta, html[data-theme="ar"] .hl-card__meta b, html[data-theme="ar"] .nd-plane .ps-sec .ps-time__labs{ font-size:13px !important; }
}
@media (max-width:1023px){ html[data-theme="ar"] .ar-post b, html[data-theme="ar"] .ar-post__cat{ font-size:13px !important; } }