/* Marketing-page refresh after uiarc.dev: warm neutrals, one soft pastel hero
   surface, pill navigation, rounded controls and lighter display type. Load
   last. Every rule is scoped to .public-page, so the signed-in console, auth
   and payment screens are untouched; deleting this file and its <link>
   restores the previous look exactly. */
#app .public-page {
  --arc-bg: #f8f7f5;
  --arc-surface: #ffffff;
  --arc-ink: #262931;
  --arc-ink-2: #5b626d;
  --arc-ink-3: #8a909a;
  --arc-line: #ebe9e5;
  --arc-line-strong: #d9d6d0;
  --arc-dark: #1c1d20;
  --arc-dark-2: #26272b;
  --arc-dark-line: #34353a;
  --arc-ink-gradient: linear-gradient(100deg, #5b3fa6, #8a5a1f);
  --arc-soft-gradient: linear-gradient(135deg, #f7f3fc, #fbf6ef);
  --arc-r-control: 18px;
  --arc-r-panel: 26px;
  --arc-r-surface: 34px;
  --arc-shadow-rest: 0 1px 2px rgb(0 0 0 / .035);
  --arc-shadow-raised: 0 6px 18px rgb(0 0 0 / .065), 0 1px 3px rgb(0 0 0 / .035);
  --arc-shadow-float: 0 20px 48px rgb(0 0 0 / .1), 0 3px 10px rgb(0 0 0 / .045);
  --arc-ease: cubic-bezier(.22, 1, .36, 1);
  color: var(--arc-ink);
  background: var(--arc-bg);
  letter-spacing: -.01em;
}

/* Display type: lighter weight and tighter tracking instead of heavy bold. */
#app .public-page :is(h1, h2, h3) { color: var(--arc-ink); }
#app .public-page :is(.product-spotlight__panel, .cta-panel) :is(h2, h3) { color: #f8f7f5; }
#app .public-page :is(.hero h1, .section-heading h2, .integration-panel h2, .cta-panel h2, .product-spotlight h2) {
  font-weight: 560;
  letter-spacing: -.035em;
  line-height: 1.1;
}
#app .public-page :is(.hero__lead, .section-heading > p, .feature-card p, .integration-panel > div > p) { color: var(--arc-ink-2); }

/* Buttons: tall rounded controls, ink primary, hairline secondary. */
#app .public-page .btn {
  border-radius: var(--arc-r-control);
  transition: background-color .16s var(--arc-ease), border-color .16s var(--arc-ease),
    color .16s var(--arc-ease), transform .16s var(--arc-ease);
}
#app .public-page .btn--primary {
  color: var(--arc-bg);
  border-color: var(--arc-ink);
  background: var(--arc-ink);
  box-shadow: none;
}
#app .public-page .btn--primary:hover { border-color: #000; background: #111216; }
#app .public-page :is(.btn--secondary, .hero-app-link) {
  color: var(--arc-ink);
  border: 1px solid rgb(38 41 49 / .2);
  background: rgb(255 255 255 / .6);
}
#app .public-page :is(.btn--secondary, .hero-app-link):hover { border-color: rgb(38 41 49 / .4); background: #fff; }
#app .public-page .btn:focus-visible { outline: 2px solid var(--arc-ink); outline-offset: 2px; }

/* Navigation: translucent bar with the links grouped in one pill. */
#app .public-page .public-nav {
  background: rgb(248 247 245 / .82);
  border-bottom: 1px solid transparent;
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  backdrop-filter: saturate(1.4) blur(14px);
}
#app .public-page .public-nav.aidestra-nav-ready:not(.aidestra-nav-compact) .public-nav__links {
  padding: 4px;
  border: 1px solid var(--arc-line);
  border-radius: var(--arc-r-control);
  background: var(--arc-surface);
  box-shadow: var(--arc-shadow-rest);
}
#app .public-page .public-nav.aidestra-nav-ready:not(.aidestra-nav-compact) .public-nav__links .btn {
  min-block-size: 36px;
  padding: 6px 14px;
  border-radius: 14px;
  color: var(--arc-ink-2);
  font-weight: 500;
}
#app .public-page .public-nav.aidestra-nav-ready:not(.aidestra-nav-compact) .public-nav__links .btn:hover {
  color: var(--arc-ink);
  background: #f2f1ee;
}
#app .public-page .public-nav.aidestra-nav-ready.aidestra-nav-compact .aidestra-nav-panel {
  border-color: var(--arc-line);
  border-radius: var(--arc-r-panel);
  box-shadow: var(--arc-shadow-float);
}
#app .public-page .language-picker select { border-radius: 14px; border-color: var(--arc-line-strong); }

/* Hero: one inset surface washed with three soft corner gradients. */
#app .public-page .hero {
  position: relative;
  inline-size: min(1360px, calc(100% - 32px));
  margin: 16px auto 0;
  padding-block: clamp(56px, 7vw, 96px);
  border: 1px solid var(--arc-line);
  border-radius: var(--arc-r-surface);
  background:
    radial-gradient(32% 42% at 3% 96%, rgb(233 186 187 / .75), transparent 100%),
    radial-gradient(35% 50% at 95% 5%, rgb(175 199 246 / .8), transparent 100%),
    radial-gradient(45% 45% at 50% 110%, rgb(232 217 173 / .7), transparent 100%),
    #fbfaf8;
  overflow: hidden;
}
#app .public-page .hero .eyebrow {
  padding: 6px 12px;
  border: 1px solid rgb(38 41 49 / .1);
  border-radius: 999px;
  color: var(--arc-ink);
  background: rgb(255 255 255 / .7);
  font-weight: 500;
}
#app .public-page .hero .eyebrow__spark { color: #6d4fc0; }
#app .public-page .hero h1 { font-size: clamp(2.5rem, 4.6vw, 4rem); }
#app .public-page .hero h1 span {
  color: transparent;
  background: var(--arc-ink-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
#app .public-page .hero__meta { color: var(--arc-ink-2); }
#app .public-page .hero__meta .icon { color: var(--arc-ink); }

/* Gateway card: a raised white panel with a dark endpoint well. */
#app .public-page .connection-map {
  border: 1px solid rgb(255 255 255 / .8);
  border-radius: var(--arc-r-panel);
  background: rgb(255 255 255 / .72);
  box-shadow: var(--arc-shadow-float);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
#app .public-page .connection-map__endpoint {
  border: 0;
  border-radius: var(--arc-r-control);
  background: var(--arc-dark);
}
#app .public-page .connection-route {
  border-color: var(--arc-line);
  border-radius: var(--arc-r-control);
  background: var(--arc-surface);
  box-shadow: var(--arc-shadow-rest);
  transition: transform .24s var(--arc-ease), box-shadow .24s var(--arc-ease);
}
#app .public-page .connection-route:hover { transform: translateY(-1px); box-shadow: var(--arc-shadow-raised); }
#app .public-page .connection-route__number { color: var(--arc-ink-3); }
#app .public-page .connection-map__footer > span:last-child { color: var(--arc-ink); }

/* Dark panels: neutral charcoal instead of navy. */
#app .public-page :is(.product-spotlight__panel, .cta-panel, .code-window) {
  border: 1px solid var(--arc-dark-line);
  background: var(--arc-dark);
}
#app .public-page :is(.product-spotlight__panel, .cta-panel) {
  border-radius: var(--arc-r-surface);
  background:
    radial-gradient(40% 70% at 100% 0%, rgb(175 199 246 / .14), transparent 100%),
    radial-gradient(35% 60% at 0% 100%, rgb(233 186 187 / .1), transparent 100%),
    var(--arc-dark);
}
#app .public-page .product-spotlight { background: transparent; padding-block-start: 24px; }
#app .public-page .product-spotlight h2 span,
#app .public-page .cta-panel .section-kicker,
#app .public-page .product-spotlight__eyebrow { color: #cdbff2; }
#app .public-page :is(.product-spotlight__summary) { color: #f1f0ee; }
#app .public-page :is(.product-spotlight__login, .product-spotlight__platform, .product-spotlight__availability, .cta-panel p) { color: #a7a9ae; }
#app .public-page .product-capability {
  border-color: var(--arc-dark-line);
  border-radius: var(--arc-r-control);
  background: var(--arc-dark-2);
}
#app .public-page :is(.product-spotlight__actions .btn, .btn--light) {
  color: var(--arc-ink);
  border-color: transparent;
  background: var(--arc-bg);
}
#app .public-page :is(.product-spotlight__actions .btn, .btn--light):hover { background: #fff; }
#app .public-page .btn--outline-light { border-color: rgb(255 255 255 / .22); background: transparent; }
#app .public-page .btn--outline-light:hover { border-color: rgb(255 255 255 / .45); background: rgb(255 255 255 / .06); }

/* Code window. */
#app .public-page .code-window { border-radius: var(--arc-r-panel); box-shadow: var(--arc-shadow-float); }
#app .public-page .code-window__bar { border-bottom-color: var(--arc-dark-line); background: var(--arc-dark-2); color: #a7a9ae; }
#app .public-page .window-dots i { background: #4a4b50; }

/* Sections and provider strip. */
#app .public-page :is(.logo-strip, .section, .section--tint, .public-footer) { background: transparent; }
#app .public-page .logo-strip { border: 0; }
#app .public-page .logo-strip__label { color: var(--arc-ink-3); }
#app .public-page .provider-list span { color: var(--arc-ink-2); font-weight: 500; }
#app .public-page .section-kicker {
  color: var(--arc-ink-3);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .8125rem;
  letter-spacing: 0;
}
#app .public-page .section-heading h2 { font-size: clamp(2rem, 3.2vw, 2.6rem); }

/* Feature cards: separate rounded tiles instead of one ruled grid. */
#app .public-page .feature-grid {
  gap: 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#app .public-page .feature-card {
  border: 1px solid var(--arc-line);
  border-radius: var(--arc-r-panel);
  background: var(--arc-surface);
  box-shadow: var(--arc-shadow-rest);
  overflow: hidden;
  transition: transform .24s var(--arc-ease), box-shadow .24s var(--arc-ease), border-color .24s var(--arc-ease);
}
#app .public-page .feature-card:hover {
  border-color: var(--arc-line-strong);
  box-shadow: var(--arc-shadow-raised);
  transform: translateY(-2px);
}
#app .public-page .feature-card.mo-spotlight::before {
  background: radial-gradient(16rem circle at var(--mo-spot-x, 50%) var(--mo-spot-y, 50%),
    rgb(175 160 230 / calc(var(--mo-spot-alpha) * .9)), transparent 65%);
}
#app .public-page .feature-card__icon,
#app .public-page .feature-card:nth-child(n) .feature-card__icon {
  border-radius: 12px;
  color: var(--arc-ink);
  background: var(--arc-soft-gradient);
  box-shadow: inset 0 0 0 1px rgb(38 41 49 / .06);
}
#app .public-page .check-list .icon { color: var(--arc-ink); }

/* Footer. */
#app .public-page .public-footer { border-top-color: var(--arc-line); }
#app .public-page .public-footer :is(p, .public-footer__links) { color: var(--arc-ink-3); }
#app .public-page .public-footer__links > a { color: var(--arc-ink-2); }
#app .public-page .public-footer__links > a:hover { color: var(--arc-ink); }

@media (max-width: 720px) {
  #app .public-page .hero { inline-size: calc(100% - 16px); margin-block-start: 8px; border-radius: var(--arc-r-panel); }
  #app .public-page :is(.product-spotlight__panel, .cta-panel) { border-radius: var(--arc-r-panel); }
}
@media (prefers-reduced-motion: reduce) {
  #app .public-page :is(.feature-card, .connection-route, .btn) { transition: none; }
  #app .public-page :is(.feature-card, .connection-route):hover { transform: none; }
}