/* Launch layer: restrained paper, blush, powder blue, and lilac. */
:root {
  --launch-paper: #fbf9fe;
  --launch-ink: #1e1c25;
  --launch-blush: #f4dde2;
  --launch-blue: #dceaf4;
  --launch-lilac: #e8e2f3;
  --launch-copper: #b8754d;
  --launch-line: #34271e14;
  --launch-shadow: 0 12px 34px #392e2512;
}

.hero-wash {
  background: radial-gradient(ellipse at 88% 18%, #dceaf438, transparent 47%), radial-gradient(ellipse at 8% 84%, #f4dde23d, transparent 43%), radial-gradient(ellipse at 54% 16%, #e8e2f32b, transparent 36%), var(--launch-paper);
}

.product-window,
.detail-cards article,
.solution-card,
.resource-card,
.platform-card,
.hero-screen,
.marketplace-card,
.story-panel,
.compatibility-contract article,
.tech-brief article {
  border-color: var(--launch-line);
  box-shadow: var(--launch-shadow);
}

.button,
.text-link,
.downloads-link-grid > a,
.marketplace-model-links > a,
.story-tabs button,
.ecosystem-filters button,
.marketplace-filters button,
.slider-arrow {
  min-height: 44px;
}

.ecosystem-band {
  margin-block: 84px;
  padding: 44px 0;
  border-block: 1px solid var(--launch-line);
  background: linear-gradient(106deg, #f4dde245, #fbf9fe 44%, #dceaf445);
}

.ecosystem-band-heading {
  max-width: 620px;
  margin: 0 auto 30px;
  text-align: center;
}

.ecosystem-band-heading h2,
.marketplace-teaser h2 { color: var(--launch-ink); }

.brand-rail {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: center;
  gap: 20px;
  max-width: 1320px;
  margin-inline: auto;
  padding-inline: 34px;
}

.brand-rail > * {
  min-width: 0;
  min-height: 76px;
  display: grid;
  place-items: center;
  color: #454255;
  font-size: 12px;
  gap: 14px;
  letter-spacing: 0;
  line-height: 1;
  filter: saturate(.78);
}

.platform-dock {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--launch-line);
  border-radius: 16px;
  background: #fbf9fede;
  box-shadow: var(--launch-shadow);
}

.platform-dock > * {
  min-width: 0;
  min-height: 104px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  border-radius: 11px;
  color: #3c394b;
  font-size: 10px;
  font-weight: 750;
  text-align: center;
}

.platform-dock .icon,
.platform-dock svg { width: 32px; height: 32px; color: var(--launch-copper); }

.story-slider {
  position: relative;
  margin-block: 88px;
  padding: clamp(22px, 4vw, 50px);
  overflow: clip;
  border: 1px solid var(--launch-line);
  border-radius: 22px;
  background: linear-gradient(135deg, #fbf9fe 8%, #e8e2f34b 54%, #dceaf45c);
}

.story-slider::after {
  content: '';
  position: absolute;
  width: min(44vw, 470px);
  aspect-ratio: 1;
  right: -18%;
  top: -42%;
  border: 1px solid #b8754d27;
  border-radius: 50%;
  box-shadow: 0 0 0 50px #dceaf420, 0 0 0 100px #e8e2f322;
  pointer-events: none;
}

.story-tabs,
.ecosystem-filters,
.marketplace-filters {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.story-tabs { margin-bottom: 26px; }

.story-tabs button,
.ecosystem-filters button,
.marketplace-filters button,
.slider-arrow {
  border: 1px solid var(--launch-line);
  border-radius: 8px;
  padding: 10px 15px;
  background: #fbf9fec7;
  color: #423f51;
  font-size: 11px;
  font-weight: 750;
  transition: background .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.story-tabs button[aria-selected='true'],
.ecosystem-filters button[aria-pressed='true'],
.marketplace-filters button[aria-pressed='true'] {
  border-color: #b8754d66;
  background: #f4dde29c;
  color: #653a26;
  box-shadow: 0 5px 18px #b8754d16;
}

.story-tabs button:hover,
.ecosystem-filters button:hover,
.marketplace-filters button:hover,
.slider-arrow:hover {
  border-color: #b8754d7a;
  box-shadow: 0 6px 18px #392e2511;
  transform: translateY(-1px);
}

.story-panel {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: center;
  padding: clamp(20px, 3vw, 34px);
  border-radius: 15px;
  background: #fbf9fec9;
  opacity: 1;
  transition: opacity .22s ease;
}

.story-panel[hidden] { display: none; }
.story-visual { min-width: 0; border-radius: 12px; overflow: hidden; box-shadow: var(--launch-shadow); }
.story-visual > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.story-copy { max-width: 470px; }
.story-copy h3 { color: var(--launch-ink); font-size: clamp(28px, 3vw, 43px); }
.story-copy > p { margin-top: 18px; font-size: 13px; line-height: 1.85; }
.story-copy dl { margin: 27px 0 0; display: grid; grid-template-columns: 110px 1fr; gap: 10px 18px; font-size: 11px; }
.story-copy dt { color: var(--launch-copper); font-weight: 800; }
.story-copy dd { margin: 0; color: #58546c; }
.story-controls { position: relative; z-index: 1; display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.slider-arrow { display: inline-grid; place-items: center; width: 44px; padding: 0; }

.ecosystem-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
  gap: clamp(34px, 7vw, 110px);
  align-items: center;
  min-height: 560px;
  padding-block: 70px 84px;
}

.ecosystem-hero-art,
.marketplace-hero-art {
  width: 100%;
  min-width: 0;
  position: relative;
}

.ecosystem-hero-art > img,
.marketplace-hero-art > img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--launch-line);
  border-radius: 20px;
  box-shadow: 0 20px 48px #392e2520;
}

.ecosystem-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-top: 28px;
}

.ecosystem-grid > * {
  min-width: 0;
  min-height: 132px;
  padding: 18px;
  border: 1px solid var(--launch-line);
  border-radius: 12px;
  background: #fbf9fe;
  box-shadow: 0 8px 22px #392e250b;
}

.compatibility-contract {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-block: 76px;
}

.compatibility-contract article,
.tech-brief article {
  padding: 28px;
  border: 1px solid var(--launch-line);
  border-radius: 14px;
  background: linear-gradient(145deg, #fbf9fe, #dceaf42e);
}

.compatibility-contract h3,
.tech-brief h3 { color: var(--launch-ink); font-size: 21px; }
.compatibility-contract p,
.tech-brief p { margin-top: 12px; font-size: 12px; line-height: 1.85; }

.marketplace-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
  gap: clamp(34px, 7vw, 110px);
  align-items: center;
  min-height: 585px;
  padding-block: 76px 96px;
}

.marketplace-hero-copy { max-width: 650px; }
.marketplace-hero h1 { font-size: clamp(42px, 5.4vw, 68px); }
.marketplace-hero-copy > p:not(.eyebrow) { margin: 23px 0; max-width: 570px; font-size: 14px; line-height: 1.9; }
.marketplace-intro { padding-block: 38px 88px; }
.marketplace-status { margin: 16px 0 20px; font-size: 11px; color: #605c77; }

.marketplace-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.marketplace-card {
  min-width: 0;
  min-height: 268px;
  display: flex;
  flex-direction: column;
  padding: 25px;
  border: 1px solid var(--launch-line);
  border-radius: 14px;
  background: linear-gradient(145deg, #fbf9fe, #f4dde224);
}

.marketplace-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.marketplace-kind { margin: 22px 0 8px; color: var(--launch-copper); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.marketplace-card h3 { color: var(--launch-ink); font-size: 23px; }
.marketplace-card > p:not(.marketplace-kind) { margin: 12px 0 20px; font-size: 11px; line-height: 1.8; }
.marketplace-card .text-link { margin-top: auto; }

.marketplace-review-section {
  padding-block: 82px;
  background: linear-gradient(115deg, #dceaf453, #fbf9fe 48%, #e8e2f34b);
  border-block: 1px solid var(--launch-line);
}

.marketplace-review-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 7vw, 100px); align-items: start; }
.marketplace-review-layout h2 { color: var(--launch-ink); font-size: clamp(34px, 4vw, 51px); }
.marketplace-review-layout > div > p:not(.eyebrow) { margin-top: 20px; max-width: 430px; font-size: 13px; }
.marketplace-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.marketplace-review-grid article { padding: 22px; border: 1px solid var(--launch-line); border-radius: 12px; background: #fbf9fec7; box-shadow: 0 8px 22px #392e250b; }
.marketplace-review-grid article > span { color: var(--launch-copper); }
.marketplace-review-grid h3 { margin-top: 15px; color: var(--launch-ink); font-size: 16px; }
.marketplace-review-grid p { margin-top: 8px; font-size: 10px; line-height: 1.85; }

.marketplace-model { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 7vw, 95px); padding-block: 84px; }
.marketplace-model h2 { color: var(--launch-ink); }
.marketplace-model > div > p:not(.eyebrow) { margin-top: 20px; max-width: 500px; font-size: 13px; }
.marketplace-model-links { display: grid; gap: 10px; align-content: center; }
.marketplace-model-links > a { min-height: 72px; display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid var(--launch-line); border-radius: 10px; background: #fbf9fe; box-shadow: 0 7px 20px #392e250a; }
.marketplace-model-links > a > .icon:last-child { margin-left: auto; }
.marketplace-model-links strong { display: block; font-size: 12px; color: var(--launch-ink); }
.marketplace-model-links small { display: block; margin-top: 3px; color: #645f7c; font-size: 10px; }

.detail-hero.hero-with-art {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
  gap: clamp(32px, 6vw, 96px);
  align-items: center;
  min-height: 510px;
}

.detail-hero.hero-with-art .detail-hero-copy { min-width: 0; position: relative; z-index: 1; }
.detail-hero.hero-with-art h1 { font-size: clamp(42px, 5vw, 60px); text-align: left; }
.detail-hero-visual { min-width: 0; position: relative; z-index: 1; }
.detail-hero-visual img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid var(--launch-line); border-radius: 18px; box-shadow: 0 18px 42px #392e251a; }
.detail-hero-visual small { display: block; margin: 11px 6px 0; color: #746f67; font-size: 10px; }

.governance-illustration { position: relative; border: 1px solid var(--launch-line); border-radius: 16px; overflow: hidden; box-shadow: var(--launch-shadow); }
.governance-illustration img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.marketplace-teaser { display: grid; grid-template-columns: minmax(0, .9fr) minmax(280px, 1.1fr); gap: clamp(32px, 7vw, 100px); align-items: center; margin-block: 90px; padding: clamp(28px, 5vw, 64px); border-block: 1px solid var(--launch-line); background: linear-gradient(112deg, #f4dde24b, #fbf9fe 50%, #dceaf448); }
.marketplace-teaser > p { margin-top: 17px; max-width: 480px; font-size: 13px; }
.marketplace-teaser img { width: 100%; border-radius: 14px; box-shadow: var(--launch-shadow); }
.tech-brief { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-block: 72px; counter-reset: tech; }
.tech-brief article { position: relative; padding-top: 54px; }
.tech-brief article::before { counter-increment: tech; content: '0' counter(tech); position: absolute; top: 20px; color: var(--launch-copper); font: 11px/1 monospace; letter-spacing: .08em; }

@media (prefers-reduced-motion: reduce) {
  .story-panel,
  .story-tabs button,
  .ecosystem-filters button,
  .marketplace-filters button,
  .slider-arrow { transition: none !important; }
}

@media (max-width: 900px) {
  .ecosystem-hero,
  .marketplace-hero,
  .detail-hero.hero-with-art,
  .marketplace-review-layout,
  .marketplace-model,
  .marketplace-teaser { grid-template-columns: 1fr; min-height: 0; }
  .detail-hero.hero-with-art .detail-hero-visual { max-width: 620px; }
  .brand-rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ecosystem-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .marketplace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compatibility-contract,
  .tech-brief { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .ecosystem-band { margin-block: 50px; padding-block: 30px; }
  .brand-rail { display: flex; overflow-x: auto; gap: 24px; padding: 2px 24px 10px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
  .brand-rail > * { min-width: 140px; min-height: 64px; scroll-snap-align: start; font-size: 12px; }
  .platform-dock { grid-template-columns: repeat(5, minmax(88px, 1fr)); overflow-x: auto; padding: 12px; }
  .platform-dock > * { min-height: 88px; }
  .story-slider { margin-block: 54px; padding: 18px; border-radius: 15px; }
  .story-panel { grid-template-columns: 1fr; gap: 22px; padding: 16px; }
  .story-copy dl { grid-template-columns: 86px 1fr; gap: 8px 13px; }
  .story-controls { justify-content: flex-start; }
  .ecosystem-hero,
  .marketplace-hero { padding-block: 48px 62px; }
  .ecosystem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ecosystem-grid > * { min-height: 110px; padding: 14px; }
  .marketplace-grid,
  .marketplace-review-grid { grid-template-columns: 1fr; }
  .marketplace-card { min-height: 0; padding: 21px; }
  .marketplace-review-section { padding-block: 54px; }
  .marketplace-model,
  .marketplace-teaser { padding-block: 52px; }
  .detail-hero.hero-with-art { gap: 28px; min-height: 0; }
  .detail-hero.hero-with-art h1 { font-size: clamp(42px, 13vw, 54px); }
  .tech-brief { margin-block: 52px; }
}
/* Claw ecosystem editorial panel. */
.nav-direct{display:flex;align-items:center;font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap}.nav-direct:hover{color:var(--orange-dark)}.desktop-nav{gap:20px;margin-left:0}.nav-wrap{gap:20px}.nav-actions{gap:10px}
.claw-section{display:grid;grid-template-columns:1.1fr 1fr;gap:65px;align-items:center}.claw-art{min-width:0}.claw-art>img{border-radius:22px;box-shadow:0 22px 50px #3d35551f;border:1px solid #fff9}.claw-brand-row{display:flex;justify-content:space-around;align-items:center;gap:12px;padding:22px 4px;font-size:12px;font-weight:750}.claw-brand-row>span{display:flex;align-items:center;gap:8px}.claw-brand-row img{width:28px;height:28px;object-fit:contain}.claw-copy>p{margin-top:22px;font-size:14px;line-height:1.8}.claw-copy>.eyebrow{margin-top:0}.claw-copy>small{display:block;color:var(--muted);font-size:10px;margin-top:23px;line-height:1.7}.claw-projects{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0}.claw-projects a{display:inline-flex;align-items:center;gap:5px;font-size:10px;min-height:36px;border:1px solid #9b90b030;background:#f4f0fa80;padding:7px 11px;border-radius:30px}.claw-projects svg{width:13px;height:13px}.support-table .brand-icon{display:inline-block;width:31px;height:31px;object-fit:contain;margin-right:12px;vertical-align:middle}.connector-mark .brand-icon{width:40px;height:40px}.detail-hero .scroll-cue{left:0;transform:none}.downloads-hero-art .platform-dock{position:relative;z-index:2}.downloads-hero .hero-art{inset:0 -38px}.mobile-marketplace{display:flex;justify-content:space-between;padding:18px 0;font-weight:700}
@media(max-width:1120px){.desktop-nav{gap:12px}.nav-wrap{gap:14px}.nav-direct,.nav-trigger{font-size:11px}.nav-actions{gap:6px}.brand{font-size:25px}.claw-section{gap:32px}}
@media(max-width:900px){.claw-section{grid-template-columns:1fr;gap:25px}.claw-art{max-width:700px}.detail-hero .scroll-cue{left:0;transform:none}}
@media(max-width:640px){.claw-section{gap:15px}.claw-brand-row{font-size:9px;gap:8px}.claw-brand-row img{width:22px;height:22px}.claw-copy h2{font-size:35px}.claw-copy>p{font-size:13px}.downloads-hero .hero-art{inset:0 -15px}.support-table .brand-icon{width:26px;height:26px}}

/* Align the editorial artwork and nested technical details with their markup. */
.brand-rail .brand-icon{width:48px;height:48px;object-fit:contain}
.platform-dock .brand-icon{width:36px;height:36px;aspect-ratio:auto;object-fit:contain;border:0;box-shadow:none;border-radius:0}
.story-copy dl{display:grid;grid-template-columns:1fr;gap:12px}.story-copy dl>div{display:grid;grid-template-columns:100px 1fr;gap:18px}.story-copy .text-link{margin-top:22px}.story-art-label{display:block;padding:12px 16px;font-size:10px;color:var(--muted);background:#fbf9fe}
.story-controls{justify-content:space-between;align-items:center}.story-controls>p{font-size:11px}.story-controls>div{display:flex;gap:8px}.slider-arrow[data-slide-prev] svg{transform:rotate(180deg)}
.story-panel:not([hidden]){animation:story-panel-in .22s ease both}@keyframes story-panel-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.how-it-works .story-slider,.platform-runway .story-slider{margin:30px 0 0}
.compatibility-contract{display:block}.compatibility-contract>div:not(.button-row){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px}
.ecosystem-grid h3{font-size:17px;margin-top:20px}.ecosystem-grid p{font-size:11px;margin-top:9px}.ecosystem-grid .brand-icon{width:56px;height:56px;object-fit:contain}.ecosystem-grid small{font-size:9px;color:var(--muted)}
.detail-hero.hero-with-art{text-align:left}.detail-hero.hero-with-art .eyebrow,.detail-hero.hero-with-art .button-row,.detail-hero.hero-with-art .hero-footnote{justify-content:flex-start}.detail-hero.hero-with-art .intro{margin-left:0}.detail-hero-visual img{aspect-ratio:3/2}.detail-hero-visual>span{display:block;margin:11px 6px 0;color:var(--muted);font-size:10px}
.marketplace-teaser>div>p:not(.eyebrow){margin:20px 0;max-width:480px;font-size:13px}
@media(max-width:900px){.compatibility-contract>div:not(.button-row){grid-template-columns:1fr}.story-panel{grid-template-columns:1fr}}
@media(max-width:640px){.story-copy dl>div{grid-template-columns:86px 1fr;gap:13px}.brand-rail>a{font-size:12px}}
@media(prefers-reduced-motion:reduce){.story-panel:not([hidden]){animation:none!important}}
html[data-motion="paused"] .story-panel{animation:none!important}

/* Contextual artwork keeps technical pages visual beyond the hero. */
.detail-section-illustrated{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:48px;position:relative}
.detail-section-illustrated .editorial-copy{min-width:0}.detail-section-illustrated .detail-section-heading{gap:18px}.detail-section-illustrated .detail-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:28px}.detail-section-illustrated .detail-cards article{padding:20px}.detail-section-illustrated .detail-cards h3{font-size:17px;margin:16px 0 12px}.detail-section-illustrated .detail-cards p{font-size:11px;line-height:1.8}.detail-section-illustrated .detail-cards:has(article:only-child){grid-template-columns:1fr}
.editorial-scene{position:relative;margin:0;min-width:0;padding:10px;border:1px solid #ded9e570;border-radius:24px;background:linear-gradient(140deg,#f2dce650,#e2ecf590 55%,#ece4f160);box-shadow:0 18px 54px #44344e12}
.editorial-scene>img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:16px}.editorial-scene>figcaption{padding:13px 10px 6px;font-size:10px;line-height:1.7;color:#62646a;letter-spacing:.01em}.editorial-reverse .editorial-scene{grid-column:1;grid-row:1}.editorial-reverse .editorial-copy{grid-column:2;grid-row:1}
.detail-section-wide{position:relative}.editorial-screen{margin:32px 0 0;padding:22px 22px 14px;border-radius:22px;background:linear-gradient(115deg,#e7edf6b0,#f8f3f3,#f1e4ee90);border:1px solid #dfdce660}.editorial-screen .product-window{box-shadow:0 16px 38px #43354c14}.editorial-caption{font-size:11px;margin:16px 2px 0;line-height:1.7}.editorial-screen .window-bar>button{min-width:44px;min-height:44px}.detail-section-wide .detail-cards{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
@media(min-width:901px){.detail-section-illustrated:nth-child(3n){background:radial-gradient(ellipse at 70% 50%,#e5e0f133,transparent 67%)}.detail-section-illustrated .editorial-scene{transform:rotate(1deg)}.detail-section-illustrated.editorial-reverse .editorial-scene{transform:rotate(-1deg)}}
@media(max-width:900px){.detail-section-illustrated{grid-template-columns:1fr;gap:28px}.editorial-reverse .editorial-copy,.editorial-reverse .editorial-scene{grid-column:auto;grid-row:auto}.editorial-scene{max-width:680px;width:100%;margin-inline:auto}.editorial-copy{max-width:750px}.editorial-screen{padding:15px}.detail-section-illustrated .detail-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.detail-section-illustrated{gap:25px}.detail-section-illustrated .detail-cards{grid-template-columns:1fr}.editorial-scene{padding:7px;border-radius:17px}.editorial-scene>img{border-radius:11px}.editorial-scene>figcaption{font-size:10px;padding:11px 7px 5px}.editorial-screen{padding:9px;border-radius:14px;margin-top:25px}.editorial-caption{font-size:10px;margin:12px 5px 4px}.detail-section-wide .detail-cards{grid-template-columns:1fr}}

/* Night chapters keep warm artwork against quiet indigo and plum blends. */
.hero-dark {
  --night-ink: #fff9f7;
  --night-copy: #e0e3ef;
  --night-muted: #bdc6da;
  width: min(1360px, calc(100% - 48px));
  max-width: 1360px;
  margin-top: 24px;
  padding-inline: clamp(28px, 5vw, 68px);
  border: 1px solid #b6bce52b;
  border-radius: 30px;
  background: #171a2e;
  color: var(--night-ink);
  box-shadow: 0 25px 65px #24234320, 0 2px 8px #28254815;
}
.hero-dark.hero-illustrated .hero-art { inset: 0; border-radius: inherit; mask-image: none; }
.hero-dark .hero-wash { background: radial-gradient(ellipse at 95% 20%, #66559c70, transparent 52%), radial-gradient(ellipse at 62% 96%, #334f856b, transparent 55%), radial-gradient(ellipse at 92% 76%, #af668148, transparent 42%), #171a2e; }
.hero-dark .hero-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #171a2e88, #171a2e08 70%); }
.hero-dark .hero-grain { mix-blend-mode: screen; opacity: .05; }
.hero-dark .hero-contours { stroke: #a4a1e0; opacity: .18; }
.hero-dark .hero-circuit { stroke: #a8c3ee; opacity: .2; }
.hero-dark .hero-traces { stroke: #efb593; opacity: .65; }
.hero-dark .hero-stars { stroke: #dfbada; opacity: .35; }
.hero-dark .hero-fold { stroke: #c6b1e8; opacity: .2; }
.hero-dark .hero-nodes { stroke: #a8c3ee; fill: #30374f; }
.hero-dark h1 { color: var(--night-ink); }
.hero-dark h1 > span { color: #e3b8c6; background: linear-gradient(100deg, #f2bc96 5%, #e7baca 48%, #b6c9f3); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.hero-dark :is(.hero-description, .detail-intro, .marketplace-hero-copy > p:not(.eyebrow), .ecosystem-hero-copy > p:not(.eyebrow)) { color: var(--night-copy); }
.hero-dark :is(.eyebrow, .hero-footnote, .stage-label, .breadcrumb, .scroll-cue, .detail-hero-visual > span, .marketplace-hero-art > span) { color: var(--night-muted); }
.hero-dark .eyebrow > span { background: #dca988; box-shadow: 0 0 12px #dca98855; }
.hero-dark .button { color: #f5e8e7; border-color: #c9c8e152; background: #ffffff06; box-shadow: inset 0 1px 0 #ffffff08, 0 5px 22px #0c10221a; }
.hero-dark .button.primary { border-color: #e5ad828a; color: #ffd3b1; background: #e3a36f08; }
.hero-dark .button:hover { border-color: #e8c0d1; background: #ffffff0e; box-shadow: 0 0 26px #baa0ed25, 0 6px 24px #080d2429; }
.hero-dark .button:focus-visible, .hero-dark a:focus-visible { outline: 2px solid #c0d8ff; outline-offset: 5px; }
.hero-dark .scroll-cue { left: clamp(28px, 5vw, 68px); }
.hero-dark .scroll-track { background: #ffffff08; border-color: #a9b4d85c; }
.hero-dark .scroll-track i { background: #e0b296; }
.hero-dark .orbit { border-color: #bbabea40; }
.hero-dark .mascot-glow { background: radial-gradient(ellipse, #bf8dc533, transparent 66%); }
.hero-dark :is(.detail-hero-visual img, .marketplace-hero-art > img, .ecosystem-hero-art > img) { border-color: #c5b5df55; box-shadow: 0 20px 55px #070b254d, 0 0 40px #b9a1dc17; }
.hero-dark.hero h1 { font-size: clamp(56px, 5.9vw, 80px); }
.hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: clamp(40px, 4.3vw, 61px); }
.hero-dark.ecosystem-hero { gap: 48px; }
.ecosystem-hero-copy > p:not(.eyebrow) { margin: 24px 0; font-size: 14px; line-height: 1.9; }
.hero-capability-tags { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.hero-capability-tags > span { display: inline-flex; gap: 7px; align-items: center; color: #dfe1f0; font-size: 10px; padding: 9px 12px; border: 1px solid #c1b8db42; border-radius: 30px; background: #ffffff05; }
.hero-capability-tags .icon { width: 16px; height: 16px; color: #c6bcf2; }
.marketplace-hero-art > span { display: flex; align-items: center; gap: 8px; margin: 14px 4px 0; font-size: 11px; }
.marketplace-hero-art > span .icon { width: 16px; }
.policy-section { background: radial-gradient(ellipse at 82% 20%, #5144685c, transparent 58%), radial-gradient(ellipse at 15% 94%, #334d6855, transparent 50%), #202638; }
.policy-copy h2 > span { color: #c9c5ec; }
.policy-copy .eyebrow, .policy-copy p:not(.eyebrow) { color: #c3cadb; }
.policy-section .engine-box { background: #171f31; border-color: #b9b3e35c; }

/* A scalable signature illustration; the page's motion control pauses it. */
.hero-art .mascot-lineart { position: absolute; width: min(64vw, 730px); height: auto; right: -110px; bottom: -95px; color: #a37b76; opacity: .08; transform: rotate(-12deg); }
.hero-dark .hero-art .mascot-lineart { color: #d4b8ed; opacity: .18; }
.mascot-lineart .shell path { stroke-dasharray: 1; animation: mascot-outline 22s ease-in-out infinite; }
.mascot-lineart .shell path:nth-child(2n) { animation-delay: -7s; }
.mascot-lineart .circuit path { stroke-dasharray: .15 .85; animation: mascot-circuit 12s linear infinite; }
@keyframes mascot-outline { 0%, 10%, 90%, 100% { stroke-dashoffset: 0; } 35%, 45% { stroke-dashoffset: 1; } 65% { stroke-dashoffset: 0; } }
@keyframes mascot-circuit { to { stroke-dashoffset: -1; } }
.hero-outside .mascot-lineart *, html[data-motion='paused'] .mascot-lineart * { animation-play-state: paused !important; }

/* Agent and provider rails are native scrolling regions, never forced autoplay. */
.ecosystem-band-heading { max-width: 730px; }
.ecosystem-band-heading h2 { font-size: clamp(30px, 4vw, 47px); margin-bottom: 20px; }
.brand-scroller { margin-top: 30px; }
.brand-scroll-heading { display: flex; gap: 20px; justify-content: space-between; align-items: center; margin-bottom: 14px; padding-inline: 8px; }
.brand-scroll-heading h3 { font-size: 17px; letter-spacing: -.03em; }
.brand-scroll-actions { display: flex; align-items: center; gap: 8px; }
.brand-scroll-actions > span { color: #6d6b76; font-size: 10px; margin-right: 8px; }
.brand-scroll-actions [data-rail-prev] svg { transform: rotate(180deg); }
.brand-scroll-actions button:disabled { opacity: .38; cursor: default; transform: none; }
.brand-scroller .brand-rail { display: flex; overflow-x: auto; overscroll-behavior-inline: contain; gap: 14px; padding: 8px 4px 20px; scroll-snap-type: x proximity; scrollbar-color: #c5b5cc #eae5ec; scrollbar-width: thin; }
.brand-scroller .brand-rail > a { flex: 0 0 172px; min-height: 190px; display: flex; flex-direction: column; justify-content: flex-start; gap: 10px; padding: 23px 15px 18px; border: 1px solid #d5cbdc75; border-radius: 16px; background: linear-gradient(145deg, #fffdfbd9, #f3eff785); box-shadow: 0 7px 16px #48364f09; scroll-snap-align: start; text-align: center; filter: none; line-height: 1.45; transition: border-color .2s, box-shadow .2s; }
.brand-scroller .brand-rail > a:hover { border-color: #b79bc499; box-shadow: 0 6px 20px #ad8dc523; }
.brand-scroller .brand-rail strong { font-size: 13px; color: #292a36; margin-top: 4px; }
.brand-scroller .brand-rail > a > span { color: #6a527b; background: #eae0f16b; border-radius: 20px; padding: 3px 9px; font-size: 9px; }
.brand-scroller .brand-rail small { font-size: 10px; line-height: 1.55; color: #696575; }
.brand-rail .brand-icon { flex-shrink: 0; }
.brand-servicenow { width: 108px !important; object-fit: contain; }
.ecosystem-band .preview-note { text-align: center; margin-top: 18px; }
.ecosystem-category { display: inline-block; margin-top: 16px; font-size: 9px; color: #6c557d; background: #e9e0f082; padding: 4px 8px; border-radius: 20px; }
.corporate-connections { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; padding: 44px; margin-block: 60px; border: 1px solid #d9cce34d; border-radius: 22px; background: linear-gradient(135deg, #f4e7ed80, #e8edf985); box-shadow: var(--launch-shadow); }
.corporate-connections h2 { font-size: clamp(30px, 3.5vw, 44px); }
.corporate-connections p:not(.eyebrow) { margin-top: 20px; font-size: 13px; }
.corporate-connections .text-link { margin-top: 18px; }
.corporate-flow { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.corporate-flow > span { display: flex; align-items: center; gap: 12px; padding: 20px 14px; background: #fff9; border: 1px solid #d8cfe190; border-radius: 12px; font-size: 11px; font-weight: 700; box-shadow: 0 6px 20px #42354c08; }
.corporate-flow .icon { color: #8271a6; width: 22px; flex-shrink: 0; }
.corporate-flow > p { grid-column: 1 / -1; font-size: 11px !important; }
.claw-brand-row { font-size: 17px; gap: 18px; padding-block: 26px; color: #393343; }
.claw-brand-row img { width: 34px; height: 34px; flex-shrink: 0; }
.claw-brand-row > span { gap: 9px; }
.claw-brand-row .claw-rangoon { gap: 0; font-size: 20px; letter-spacing: -.045em; color: #24232e; }
.claw-rangoon > img { width: 42px; height: 42px; margin-right: 5px; }
.claw-projects .brand-icon { width: 18px; height: 18px; }
.claw-projects a { min-height: 44px; box-shadow: 0 4px 13px #66517608; }
.claw-projects a:first-child { border-color: #d9837140; background: #f4dfd84d; }
.claw-projects a:nth-child(2) { border-color: #86a66744; background: #e4edd948; }

/* Software connection catalog: informative cards, no installation affordance. */
.connection-catalog { padding-top: 72px; }
.connection-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; margin-top: 34px; }
.connection-filters { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 1 620px; }
.connection-filters button { min-height: 44px; border: 1px solid #d8cde0; border-radius: 9px; padding: 9px 14px; color: #595063; background: #fffbf8a8; font-size: 11px; font-weight: 700; }
.connection-filters button[aria-pressed='true'] { color: #5d3d69; border-color: #b49bc1; background: #ebdfef80; box-shadow: 0 4px 16px #a481b118; }
.connection-search { display: grid; gap: 8px; flex: 1 1 250px; max-width: 320px; color: #5d5567; font-size: 10px; font-weight: 700; }
.connection-search input { width: 100%; min-height: 44px; border: 1px solid #d9cedf; border-radius: 10px; background: #fffaf6; padding: 12px 14px; color: #292633; font: inherit; font-size: 12px; }
#connection-status { margin-block: 21px; color: #6c6172; font-size: 11px; }
#connection-empty { padding: 32px; border: 1px dashed #c4b4d0; border-radius: 12px; background: #f3eef7; font-size: 13px; }
.connection-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.connection-card { min-width: 0; padding: 24px 20px; border: 1px solid #dfd5e282; border-radius: 16px; background: linear-gradient(145deg, #fffdfae8, #f4eff77d); box-shadow: 0 10px 26px #4b315710; }
.connection-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 50px; }
.connection-card .brand-icon { width: 44px; height: 44px; object-fit: contain; }
.connection-card .brand-servicenow { width: 96px !important; }
.connection-kind { color: #756780; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; margin: 24px 0 9px; }
.connection-card h3 { font-size: 19px; color: #2e2938; letter-spacing: -.03em; }
.connection-card > p:last-child { margin-top: 12px; font-size: 12px; line-height: 1.75; color: #6c6373; }
.coming-soon { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border: 1px solid #bea7cc66; border-radius: 20px; background: #ece3f05e; color: #745284; font-size: 9px; font-weight: 700; white-space: nowrap; }
.coming-soon::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: #9c7bb2; }
.marketplace-card-head { flex-wrap: wrap; }

@media (max-width: 1120px) { .connection-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .claw-brand-row { font-size: 14px; gap: 10px; } .claw-brand-row .claw-rangoon { font-size: 17px; } }
@media (max-width: 900px) {
  .hero-dark.hero { grid-template-columns: 1fr; }
  .hero-dark.hero h1 { font-size: 62px; }
  .hero-dark.hero .hero-copy { max-width: 590px; }
  .hero-dark .hero-composition { max-width: 680px; width: 100%; margin-inline: auto; }
  .hero-dark :is(.detail-hero-visual, .marketplace-hero-art, .ecosystem-hero-art) { max-width: 640px; }
  .corporate-connections { grid-template-columns: 1fr; gap: 28px; }
  .connection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .claw-brand-row { font-size: 17px; }.claw-brand-row .claw-rangoon { font-size: 20px; }
}
@media (max-width: 640px) {
  .hero-dark { width: calc(100% - 24px); margin-top: 12px; padding-inline: 23px; border-radius: 23px; }
  .hero-dark .hero-wash { background: linear-gradient(155deg, #171a2e 28%, #2e2944 70%, #263b54); }
  .hero-dark.hero h1 { font-size: clamp(43px, 11.4vw, 64px); }
  .hero-dark.hero-with-art h1, .hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: clamp(37px, 9.9vw, 51px); }
  .hero-dark .scroll-cue { left: 23px; }
  .hero-dark .hero-footnote { flex-wrap: wrap; }
  .hero-dark.ecosystem-hero { gap: 30px; padding-bottom: 85px; }
  .hero-dark.marketplace-hero { padding-bottom: 85px; }
  .hero-art .mascot-lineart { width: 440px; right: -130px; bottom: -90px; }
  .hero-dark .hero-art .mascot-lineart { opacity: .12; }
  .brand-scroll-heading { gap: 12px; }.brand-scroll-heading h3 { font-size: 15px; }
  .brand-scroll-actions > span { display: none; }
  .brand-scroller .brand-rail > a { flex-basis: 154px; min-height: 186px; }
  .corporate-connections { padding: 25px; }.corporate-flow { grid-template-columns: 1fr; }
  .claw-brand-row { font-size: 12px; gap: 7px; padding: 20px 0; }
  .claw-brand-row img { width: 25px; height: 25px; }
  .claw-brand-row > span { gap: 5px; }
  .claw-brand-row .claw-rangoon { font-size: 14px; }
  .claw-rangoon > img { width: 31px; height: 31px; margin-right: 3px; }
  .connection-search { max-width: none; }.connection-grid { grid-template-columns: 1fr; gap: 12px; }
  .connection-card { padding: 22px; }.connection-card-head { min-height: 48px; }
  .connection-card h3 { font-size: 21px; }.connection-kind { margin-top: 18px; }
}
@media (prefers-reduced-motion: reduce) { .mascot-lineart * { animation: none !important; } .brand-scroller .brand-rail > a { transition: none; } }
.hero-dark .stage-label { display: flex; align-items: center; gap: 8px; }
.stage-label > img { width: 25px; height: 25px; }
.claw-brand-row strong { font-weight: 750; white-space: nowrap; }
@media(max-width:640px) { .claw-brand-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }.claw-brand-row > span { flex-direction: column; gap: 8px; text-align: center; }.claw-brand-row .claw-rangoon { gap: 8px; font-size: 14px; }.claw-rangoon > img { width: 25px; height: 25px; margin: 0; }.hero-dark .stage-label { top: 0; font-size: 5px; } }

/* Full-width chapters: expansive color and art, bounded reading measures. */
:root { --page-gutter: clamp(24px, 5.6vw, 96px); --wide-gutter: max(var(--page-gutter), calc((100% - 1500px) / 2)); }
.hero-illustrated.container {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-inline: var(--wide-gutter);
  padding-block: clamp(60px, 6vw, 104px) 108px;
  border-radius: 0;
  border-inline: 0;
  box-shadow: none;
}
.hero-illustrated .hero-art { inset: 0; border-radius: 0; }
.hero-illustrated .scroll-cue { left: var(--wide-gutter); }
.hero-dark.hero-illustrated { border-top: 0; border-bottom: 1px solid #9c85c344; min-height: 740px; }
.hero-dark .hero-wash { background: radial-gradient(ellipse at 93% 15%, #8960c77a, transparent 51%), radial-gradient(ellipse at 68% 105%, #29749c9c, transparent 58%), radial-gradient(ellipse at 92% 67%, #bb638463, transparent 42%), linear-gradient(115deg, #101c32 12%, #322039 61%, #193953); }
.hero-dark .hero-art::after { background: linear-gradient(90deg, #10192da6 4%, #111b2c45 45%, transparent 80%); }
.hero-dark.hero h1 { font-size: clamp(62px, 6.9vw, 104px); line-height: 1.015; letter-spacing: -.065em; }
.hero-dark.hero-with-art h1, .hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: clamp(48px, 5.3vw, 78px); line-height: 1.045; letter-spacing: -.055em; }
.hero-dark h1 > span { background-image: linear-gradient(100deg, #ffc095 0%, #f0accf 46%, #a7d5ff 100%); }
.hero-dark .hero-description { max-width: 490px; font-size: 16px; line-height: 1.85; }
.hero-dark :is(.detail-intro, .marketplace-hero-copy > p:not(.eyebrow), .ecosystem-hero-copy > p:not(.eyebrow)) { font-size: 15px; max-width: 590px; }
.hero-dark .eyebrow { font-size: 11px; letter-spacing: .1em; }
.hero-dark .hero-footnote { font-size: 11px; }
.hero-dark .button { min-height: 50px; padding-inline: 24px; border-width: 1px; font-size: 12px; }
.hero-dark .button.primary { border-color: #edb287b0; background: #e3a36f0b; box-shadow: 0 0 26px #d38e9914; }
.hero-dark .hero-composition { height: 590px; }
.hero-dark .hero-art .mascot-lineart { width: min(70vw, 1000px); right: -80px; bottom: -90px; color: #d7c1ff; opacity: .22; }
.hero-dark .hero-contours { stroke: #c9b1ed; opacity: .25; }
.hero-dark .hero-traces { stroke: #ffbd99; opacity: .8; }
.hero-dark .stage-label { color: #e0d8ed; font-size: 9px; }
.ecosystem-band.container { width: 100%; max-width: none; margin-block: 0 88px; padding: 72px var(--wide-gutter) 54px; background: radial-gradient(ellipse at 6% 15%, #f0d5e477, transparent 52%), radial-gradient(ellipse at 96% 78%, #c9e1f38c, transparent 50%), linear-gradient(135deg, #f9f1f4, #f3f0fa 55%, #eef5fb); border-top: 0; }
.ecosystem-band-heading h2 { font-size: clamp(36px, 4.2vw, 60px); letter-spacing: -.055em; }
.brand-scroller { margin-top: 40px; }
.brand-scroll-heading { padding-inline: 4px; }
.brand-scroll-heading h3 { font-size: 20px; }
.brand-scroller .brand-rail { max-width: none; scroll-snap-type: none; }
.brand-scroller .brand-rail > a { flex-basis: 194px; min-height: 208px; padding: 25px 19px 20px; background: linear-gradient(145deg, #fffefbf5, #f5f0fbc9); border-color: #cdbad87d; box-shadow: 0 10px 24px #53416d0e; }
.brand-scroller .brand-rail .brand-icon { width: 54px; height: 54px; }
.brand-scroller .brand-rail strong { font-size: 14px; }
.brand-scroller .brand-rail small { font-size: 11px; }
.rail-motion-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 84px; padding: 8px 13px; border: 1px solid #b9a5c879; border-radius: 9px; color: #635074; background: #fffaf990; font-size: 11px; font-weight: 750; }
.rail-motion-toggle:hover { background: #eae0f680; border-color: #a88cb8; }
.rail-motion-toggle[aria-pressed='true'] { border-color: #ad8bc4; background: #e9dff3; }
.rail-motion-toggle:disabled { opacity: .55; cursor: default; }
.brand-scroll-actions > span { min-width: 114px; text-align: right; }
@media (min-width: 1800px) { .hero-dark .hero-art .mascot-lineart { right: calc((100% - 1700px) / 2); } }
@media (max-width: 1100px) and (min-width: 901px) {
  .hero-dark.hero h1 { font-size: 64px; }
  .hero-dark .hero-composition { height: 480px; }
  .hero-dark.hero-with-art h1, .hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: 50px; }
  .hero-illustrated.container { column-gap: 32px; }
}
@media (max-width: 900px) {
  .hero-dark.hero-illustrated { min-height: 0; }
  .hero-dark.hero h1 { font-size: clamp(62px, 9vw, 84px); }
  .hero-dark .hero-composition { height: 510px; }
  .hero-dark :is(.detail-hero-visual, .marketplace-hero-art, .ecosystem-hero-art) { max-width: none; }
  .hero-dark.hero-with-art h1, .hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: clamp(48px, 7vw, 66px); }
}
@media (max-width: 640px) {
  :root { --page-gutter: 22px; }
  .hero-illustrated.container { width: 100%; margin: 0; padding: 50px var(--wide-gutter) 86px; border-radius: 0; }
  .hero-dark .hero-wash { background: radial-gradient(ellipse at 90% 70%, #76509160, transparent 60%), linear-gradient(158deg, #142037 25%, #3b284a 69%, #25506b); }
  .hero-dark.hero h1 { font-size: clamp(47px, 12.2vw, 72px); }
  .hero-dark.hero-with-art h1, .hero-dark.marketplace-hero h1, .hero-dark.ecosystem-hero h1 { font-size: clamp(40px, 10.5vw, 58px); }
  .hero-dark .hero-description { font-size: 14px; }
  .hero-dark :is(.detail-intro, .marketplace-hero-copy > p:not(.eyebrow), .ecosystem-hero-copy > p:not(.eyebrow)) { font-size: 13px; }
  .hero-dark .hero-footnote, .hero-dark .eyebrow { font-size: 9px; }
  .hero-dark .hero-composition { height: 365px; margin-bottom: 20px; }
  .hero-dark .hero-art .mascot-lineart { width: 560px; right: -130px; opacity: .17; }
  .hero-dark .stage-label { font-size: 6px; }
  .hero-dark .button { min-height: 48px; padding-inline: 18px; font-size: 11px; }
  .ecosystem-band.container { padding: 46px var(--wide-gutter) 38px; margin-bottom: 54px; }
  .brand-scroll-heading { gap: 10px; align-items: start; }
  .brand-scroll-heading h3 { font-size: 16px; max-width: 120px; padding-top: 8px; }
  .brand-scroll-actions { gap: 5px; }
  .brand-scroll-actions .slider-arrow { width: 44px; }
  .rail-motion-toggle { font-size: 10px; min-width: 72px; padding-inline: 8px; }
  .brand-scroller .brand-rail > a { flex-basis: 170px; min-height: 200px; }
}

/* Saturated atmosphere stays behind content; selection light traces the edge. */
.lifecycle { background: radial-gradient(ellipse at 10% 20%, #eac6e980, transparent 55%), radial-gradient(ellipse at 92% 84%, #bcdff3a6, transparent 58%), linear-gradient(120deg, #f9ecf2, #eeebfb 56%, #e8f3fc); }
.story-slider { background: radial-gradient(ellipse at 90% 10%, #b6d7f666, transparent 48%), linear-gradient(135deg, #f7e3ed 2%, #f4edf9 48%, #deeafa); border-color: #cab4df77; box-shadow: 0 18px 46px #6b4b9810, 0 0 40px #d6b5df20; }
.opensource-section { background: radial-gradient(ellipse at 12% 74%, #e6b3d15c, transparent 52%), radial-gradient(ellipse at 96% 20%, #abcfe673, transparent 58%), linear-gradient(130deg, #f4e9f4, #ecedf9); border-color: #cdb2d575; box-shadow: 0 20px 50px #71588512; }
.marketplace-teaser, .marketplace-review-section { background: radial-gradient(ellipse at 8% 18%, #efbdd07a, transparent 54%), radial-gradient(ellipse at 95% 80%, #b4d7ef91, transparent 58%), linear-gradient(120deg, #f9eaf0, #e9e6f7 55%, #e9f3fc); }
.closing-cta { background: radial-gradient(ellipse at 85% 22%, #c5b4efa8, transparent 55%), radial-gradient(ellipse at 10% 92%, #e8b7ca85, transparent 55%), linear-gradient(125deg, #f9eaf0, #e4edf9); border-color: #c6afdc85; box-shadow: 0 0 50px #c49bd42b, 0 18px 52px #735f9220; }
.policy-section { background: radial-gradient(ellipse at 85% 25%, #85559c70, transparent 56%), radial-gradient(ellipse at 8% 95%, #28739788, transparent 60%), linear-gradient(125deg, #19253c, #37233f 64%, #214463); }
:is(.story-tabs, .ecosystem-filters, .marketplace-filters, .connection-filters, .tour-tabs) button { position: relative; isolation: isolate; }
:is(.story-tabs, .tour-tabs) button[aria-selected='true'],
:is(.ecosystem-filters, .marketplace-filters, .connection-filters) button[aria-pressed='true'] {
  color: #543060;
  border-color: #ae80c6;
  background: linear-gradient(120deg, #f4dced, #e5e2fa 55%, #dceafa);
  box-shadow: 0 0 0 1px #c398df66, 0 0 20px #ba86d344, 0 6px 22px #648aca20, inset 0 1px 0 #fff9;
}
:is(.story-tabs, .ecosystem-filters, .marketplace-filters, .connection-filters, .tour-tabs) button:focus-visible,
.rail-motion-toggle:focus-visible, .slider-arrow:focus-visible { outline: 2px solid #8852ab; outline-offset: 4px; box-shadow: 0 0 24px #ae84d64d, 0 0 12px #8aafe93d; }
@supports (mask-composite: exclude) or (-webkit-mask-composite: xor) {
  :is(.story-tabs, .tour-tabs) button[aria-selected='true']::before,
  :is(.ecosystem-filters, .marketplace-filters, .connection-filters) button[aria-pressed='true']::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    padding: 2px;
    pointer-events: none;
    background: linear-gradient(115deg, #f1abc9, #b39df1 40%, #88c7f2 70%, #f5b590);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
  }
}
.brand-scroller .brand-rail > a:is(:hover, :focus-visible), .connection-card:hover, .marketplace-card:hover { border-color: #b58cd47a; box-shadow: 0 0 0 1px #d3b6e277, -5px 0 26px #e4a8cb30, 5px 0 26px #8dbce333, 0 14px 32px #72508c14; }
.brand-scroller .brand-rail > a:focus-visible { outline: 2px solid #825ba8; outline-offset: 4px; }
.hero-dark .button:is(:hover, :focus-visible) { box-shadow: 0 0 0 1px #d6b1e150, -4px 0 25px #ee9eb52b, 4px 0 28px #8bbde636, 0 8px 30px #090e2838; }
@media (forced-colors: active) {
  :is(.story-tabs, .tour-tabs) button[aria-selected='true'],
  :is(.ecosystem-filters, .marketplace-filters, .connection-filters) button[aria-pressed='true'] { outline: 2px solid Highlight; outline-offset: 2px; }
}

/* The shared UI now follows the same ink, iris and blush palette. */
:root { --paper: #faf8fc; --ink: #292535; --muted: #6b6278; --soft: #f0ebf7; --line: #ded5e8; --orange: #8d64ac; --orange-dark: #714e91; --launch-paper: #fbf9fe; --launch-ink: #292535; --launch-line: #5840701c; --launch-shadow: 0 12px 34px #48336013; }
body { background: #faf8fc; }
h2 > span { color: #87709c; }
::selection { background: #e6c9f0; color: #30213f; }
.announcement { background: linear-gradient(105deg, #edddf2, #e5e0f7 52%, #deecf8); color: #584568; }
.site-header { background: #faf8fced; border-bottom-color: #ddd2e780; }
.mega-menu { border-color: #d9c9e585; background: #fcfafff5; box-shadow: 0 22px 60px #4c326d20, 0 0 28px #c299df12; }
.mega-feature { background: radial-gradient(ellipse at 76% 26%, #d8bbed80, transparent 58%), linear-gradient(130deg, #f7e3ed, #e7e2f7 60%, #daeaf6); }
.mega-links > a:hover { background: linear-gradient(115deg, #efe0f5a1, #dfebf890); }
.nav-icon, .feature-icon { color: #8c6eab; }
.button.primary:not(.hero-dark .button) { color: #6e478e; border-color: #a989c17a; background: linear-gradient(110deg, #f4e7f84a, #e6e8f75c); box-shadow: 0 0 18px #bc93d01a; }
.button.secondary { border-color: #cdc0dd; color: #655273; }
.brand-ai, .claw-rangoon .brand-ai { color: #b66e41; }
.status-dot { background: #32a483; box-shadow: 0 0 0 3px #32a48316; }
.note-policy i { background: #32a483; }
.motion-toggle { color: #796091; border-color: #bca9d08c; background: #faf6fded; box-shadow: 0 6px 24px #70528f16; }
.motion-toggle:hover { border-color: #a984c0; box-shadow: 0 0 26px #ba9bd538; }
.reading-progress > span { background: linear-gradient(90deg, #a487ce, #d799bd 52%, #77b8de); box-shadow: 0 0 10px #b5a1e375; }
.closing-cta h2 > span { color: #85649f; }.closing-cta p:not(.eyebrow) { color: #746081; }.closing-cta .eyebrow { color: #88639f; }
.brand-scroll-actions .slider-arrow { flex: 0 0 44px; }.rail-motion-toggle { flex-shrink: 0; }