/* Celerity: a sculpted agent, a clear voice, one continuous journey. */
body.spatial-site.agent-premium {
  --text: #f1f2ff;
  --copy: #c1cce1;
  --accent: #b7bcff;
  --agent-bg: #080d17;
  background-color: #070a10;
  font-weight: 450;
}
body.agent-premium,body.agent-premium * { cursor: auto; }
body.agent-premium :is(a,button,summary) { cursor: pointer; }
body.agent-premium :is(input,textarea) { cursor: text; }
body.agent-premium ::selection { background: #b7bcff; color: #09101d; }
body.agent-premium .wrap { width: min(1320px,calc(100% - 96px)); }
body.agent-premium .site-header { background: #0c1423f5; }
body.agent-premium .header-inner { height: 84px; }
body.agent-premium .brand-mark { width: 42px; height: 42px; }
body.agent-premium .brand-name { font-weight: 750; }
body.agent-premium .nav { font-size: 14px; }
body.agent-premium .nav-cta { padding: 13px 23px; border-color: #8d9ace55; }
body.agent-premium :is(h1,h2,h3,h4) { text-wrap: balance; }
body.agent-premium h1 { font-weight: 580; letter-spacing: -.04em; line-height: 1.08; }
body.agent-premium h2 { font-weight: 620; font-size: clamp(2.4rem,3.8vw,4.25rem); line-height: 1.12; letter-spacing: -.035em; }
body.agent-premium h3 { font-weight: 640; }
body.agent-premium p { color: var(--copy); }
body.agent-premium .headline-line { display: block; position: relative; }
body.agent-premium .headline-accent,body.agent-premium .heading-accent { color: #b7bcff; }
body.agent-premium .headline-accent { font-weight: 650; }
body.agent-premium h2 .heading-accent { font-weight: 660; }
body.agent-premium .agent-copy p { font-size: 17px; line-height: 1.85; }
body.agent-premium .agent-large-copy { font-size: clamp(23px,2.1vw,31px); line-height: 1.55; color: #e3e9fa; }
body.agent-premium .button { position: relative; min-height: 56px; padding: 17px 25px; font-size: 14px; font-weight: 750; border: 1px solid #f2f1ff55; background: #c4c8ff; box-shadow: 0 12px 32px #0003; transition: background-color .2s,box-shadow .2s; }
body.agent-premium .button:hover { background: #e8eaff; box-shadow: 0 16px 42px #0005; }
body.agent-premium .button .icon { transition: transform .25s cubic-bezier(.16,1,.3,1); }
body.agent-premium .button:hover .icon { transform: translateX(4px); }
body.agent-premium .text-link { color: #d3d9ff; font-size: 15px; font-weight: 620; }
body.agent-premium .text-link:hover { color: #fff; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 7px; }

/* On desktop the first scene changes composition while the visitor scrolls. */


body.agent-premium .agent-hero h1 { font-size: clamp(3.5rem,5.1vw,5.3rem); font-weight: 580; letter-spacing: -.04em; line-height: 1.075; max-width: 16ch; }
body.agent-premium .agent-hero-copy { position: relative; z-index: 4; transform-origin: left center; }
body.agent-premium .agent-hero .agent-lede { font-size: 18px; line-height: 1.8; max-width: 43ch; margin-top: 30px; }
body.agent-premium .agent-actions { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 16px 25px; margin-top: 33px; }
body.agent-premium .agent-personal { font-size: 13px; line-height: 1.7; margin-top: 26px; color: #aebcd7; }
body.agent-premium .agent-sculpture-figure { position: relative; z-index: 2; width: 100%; max-width: 650px; padding: 20px 22px 24px; border: 1px solid #b6cbff15; border-radius: 22px; background: linear-gradient(140deg,#17233d45,#10172205 75%); }
body.agent-premium .agent-sculpture-stage { height: 370px; margin: 0 -18px; }
body.agent-premium .agent-sculpture-fallback { padding: 28px; }
body.agent-premium .agent-sculpture-fallback img { height: 100%; width: 100%; object-fit: contain; }




body.agent-premium .agent-mode-tabs { max-width: 500px; padding: 6px; background: #142139; border: 1px solid #aab9f32b; box-shadow: 0 16px 32px #0002; }
body.agent-premium .agent-mode-tabs button { font-size: 13px; min-height: 44px; padding: 10px 8px; }
body.agent-premium .agent-mode-tabs button[aria-pressed=true] { background: #bdc3ff; color: #10172a; }
body.agent-premium .agent-example { max-width: 500px; padding: 22px 8px 2px; min-height: 98px; }
body.agent-premium .agent-example .agent-example-heading { font-size: 17px; font-weight: 580; }
body.agent-premium .agent-example .agent-example-steps { font-size: 14px; margin-top: 8px; }
body.agent-premium .agent-sculpture-figure > figcaption { font-size: 12px; line-height: 1.6; max-width: 500px; margin-top: 10px; }



/* Bigger illustrations and readable copy share the same quiet surface. */
body.agent-premium .agent-section { padding-block: clamp(90px,8vw,142px); border: 0; }
body.agent-premium .agent-section-heading { margin-bottom: 56px; }
body.agent-premium .agent-section-heading > p { font-size: 17px; line-height: 1.8; max-width: 39ch; }
body.agent-premium .agent-introduction { background-color: transparent !important; }
body.agent-premium .agent-system-explainer { grid-template-columns: 1fr 1.05fr; gap: 80px; }
body.agent-premium .agent-system-scene .agent-scene-stage { height: 500px; }
body.agent-premium .agent-scene figcaption { font-size: 14px; color: #aebcdb; }
body.agent-premium .agent-usecases { border-top-color: #a6b5dc26; }
body.agent-premium .agent-usecase { grid-template-columns: 240px .85fr 1.15fr 30px; gap: 40px; padding-block: 38px; border-bottom-color: #9cadcf26; }
body.agent-premium .agent-usecase-scene .agent-scene-stage { height: 240px; }
body.agent-premium .agent-usecase h3 { font-size: 31px; line-height: 1.2; color: #c1c7ff; }
body.agent-premium .agent-usecase h4 { font-size: 19px; line-height: 1.5; color: #edf1ff; font-weight: 620; }
body.agent-premium .agent-usecase p { font-size: 16px; line-height: 1.85; }
body.agent-premium .agent-method-section { background-color: #0b1220 !important; }
body.agent-premium .agent-section-summary { font-size: 19px; line-height: 1.8; }
body.agent-premium .agent-process :is(h2,h3) { font-size: 23px; color: #d2d7ff; font-weight: 580; line-height: 1.35; }
body.agent-premium .agent-process p { font-size: 16px; line-height: 1.8; }
body.agent-premium .agent-process > li { padding-left: 56px; }
body.agent-premium .agent-process > li::before { font-size: 13px; color: #94a1d1; }
body.agent-premium .agent-page-intro { padding-block: 104px 78px; background-color: #070a10; }
body.agent-premium .agent-page-intro h1 { font-size: clamp(3rem,5.35vw,5.9rem); font-weight: 580; line-height: 1.1; }
body.agent-premium .agent-page-intro p { font-size: 19px; line-height: 1.8; max-width: 55ch; }
body.agent-premium .agent-intro-grid { grid-template-columns: 1.05fr .95fr; gap: 40px; }
body.agent-premium .agent-intro-scene .agent-scene-stage { height: 420px; }
body.agent-premium .agent-list :is(h3,dt) { color: #c5ceff; font-size: 23px; font-weight: 620; }
body.agent-premium .agent-list :is(p,dd) { font-size: 16px; line-height: 1.85; }
body.agent-premium .agent-cta { padding-block: 112px; background-color: #0b1220 !important; border: 0; }
body.agent-premium .agent-cta h2 { font-size: clamp(2.5rem,4.3vw,4.6rem); max-width: 21ch; }
body.agent-premium .agent-cta p { font-size: 18px; line-height: 1.8; }
body.agent-premium .footer { padding-top: 74px; background-color: #070a10; }
body.agent-premium .footer-copy { font-size: 15px; line-height: 1.8; }
body.agent-premium :is(.footer-nav,.footer-contact) { font-size: 14px; }
body.agent-premium .footer-meta { font-size: 12px; }
body.agent-premium .legal h1 { font-size: clamp(2.7rem,5vw,4.5rem); color: #c5ceff; }
body.agent-premium .legal h2 { font-size: 27px; color: #d3daff; }
body.agent-premium .legal :is(p,li) { font-size: 16px; line-height: 1.85; }


@media(max-height:820px) and (min-width:801px) {

  body.agent-premium .agent-hero h1 { font-size: clamp(3.5rem,5vw,5.4rem); }
  body.agent-premium .agent-sculpture-stage { height: 330px; }
  body.agent-premium .agent-hero .agent-lede { font-size: 17px; margin-top: 22px; }
  body.agent-premium .agent-actions { margin-top: 24px; }
  body.agent-premium .agent-personal { margin-top: 18px; }
  body.agent-premium .agent-example { min-height: 90px; padding-top: 17px; }
}
@media(max-width:1100px) {
  body.agent-premium .wrap { width: calc(100% - 64px); }
  body.agent-premium .agent-hero h1 { font-size: clamp(3.3rem,5.7vw,4.8rem); }
  body.agent-premium .agent-actions { flex-direction: column; align-items: flex-start; gap: 10px; }
  body.agent-premium .agent-usecase { grid-template-columns: 190px .85fr 1.15fr 24px; gap: 26px; }
  body.agent-premium .agent-usecase-scene .agent-scene-stage { height: 200px; }
  body.agent-premium .agent-usecase h3 { font-size: 26px; }
  body.agent-premium .agent-system-explainer { gap: 40px; }
}
@media(max-width:800px) {
  body.agent-premium .wrap { width: calc(100% - 44px); }
  body.agent-premium .header-inner { height: 76px; }
  body.agent-premium .brand-mark { width: 36px; height: 36px; }


  body.agent-premium .agent-hero h1 { font-size: clamp(3rem,8.6vw,4.8rem); }
  body.agent-premium .agent-hero .agent-lede { font-size: 17px; line-height: 1.8; margin-top: 27px; }
  body.agent-premium .agent-actions { flex-direction: row; align-items: center; gap: 14px 24px; }
  body.agent-premium .agent-personal { font-size: 12px; max-width: 42ch; }
  body.agent-premium .agent-sculpture-figure { max-width: 560px; }
  body.agent-premium .agent-sculpture-stage { height: 390px; }

  body.agent-premium h2 { font-size: clamp(2.2rem,6vw,3.4rem); }
  body.agent-premium .agent-section { padding-block: 78px; }
  body.agent-premium .agent-system-explainer,body.agent-premium .agent-intro-grid { grid-template-columns: 1fr; gap: 28px; }
  body.agent-premium .agent-system-scene .agent-scene-stage { height: 360px; }
  body.agent-premium .agent-usecase { grid-template-columns: 180px 1fr 24px; gap: 12px 26px; }
  body.agent-premium .agent-usecase > figure { grid-row: 1/3; grid-column: 1; }
  body.agent-premium .agent-usecase > h3 { grid-row: 1; grid-column: 2; }
  body.agent-premium .agent-usecase > div { grid-row: 2; grid-column: 2; }
  body.agent-premium .agent-usecase > .usecase-arrow { grid-row: 1; grid-column: 3; }
  body.agent-premium .agent-page-intro { padding-block: 60px 38px; }
  body.agent-premium .agent-page-intro h1 { font-size: clamp(2.9rem,8.1vw,4.2rem); }
  body.agent-premium .agent-page-intro p { font-size: 17px; }
  body.agent-premium .agent-intro-scene .agent-scene-stage { height: 330px; }
  body.agent-premium .agent-cta { padding-block: 76px; }
  body.agent-premium .agent-cta h2 { font-size: clamp(2.4rem,7vw,3.5rem); }
  body.agent-premium .agent-cta p { font-size: 17px; }
}
@media(max-width:520px) {
  body.agent-premium .agent-hero h1 { font-size: clamp(2.7rem,10.5vw,3.8rem); line-height: 1.1; }
  body.agent-premium .agent-actions { flex-direction: column; align-items: flex-start; }
  body.agent-premium .button { font-size: 13px; padding: 16px 22px; }
  body.agent-premium .agent-sculpture-stage { height: 320px; margin-inline: -15px; }
  body.agent-premium .agent-mode-tabs button { font-size: 11px; }
  body.agent-premium .agent-example .agent-example-heading { font-size: 16px; }
  body.agent-premium .agent-example .agent-example-steps { font-size: 13px; }
  body.agent-premium .agent-usecase { grid-template-columns: 1fr 24px; gap: 12px; padding-block: 32px; }
  body.agent-premium .agent-usecase > figure { grid-column: 1/-1; grid-row: 1; height: 235px; }
  body.agent-premium .agent-usecase-scene .agent-scene-stage { height: 235px; max-width: 360px; }
  body.agent-premium .agent-usecase > h3 { grid-column: 1; grid-row: 2; font-size: 29px; }
  body.agent-premium .agent-usecase > div { grid-column: 1/-1; grid-row: 3; }
  body.agent-premium .agent-usecase > .usecase-arrow { grid-column: 2; grid-row: 2; }
  body.agent-premium .agent-usecase p { font-size: 16px; }
  body.agent-premium .agent-copy p { font-size: 16px; }
  body.agent-premium .agent-large-copy { font-size: 23px; }
  body.agent-premium .agent-section-heading > p { font-size: 16px; }
  body.agent-premium .agent-system-scene .agent-scene-stage { height: 330px; }
  body.agent-premium .agent-intro-scene .agent-scene-stage { height: 300px; }
  body.agent-premium .agent-page-intro h1 { font-size: clamp(2.55rem,9.8vw,3.4rem); }
}


/* Original composition restored: native scrolling, a distinct task illustration. */
body.spatial-site.agent-premium .agent-hero { position: relative; display: flex; min-height: 690px; padding: 72px 0 82px; overflow: clip; background: radial-gradient(ellipse at 84% 24%,#536ea32b,transparent 55%),radial-gradient(ellipse at 25% 90%,#1a51651c,transparent 62%); }
body.agent-premium .agent-hero-grid { position: relative; grid-template-columns: 1fr 1.03fr; gap: 64px; align-items: center; z-index: 2; }
body.agent-premium .agent-hero-copy { display: block; }
body.agent-premium .agent-hero .agent-actions { gap: 15px 24px; }
body.agent-premium .agent-hero .agent-lede { margin-top: 25px; max-width: 43ch; }
body.agent-premium .agent-hero .agent-personal { margin-top: 23px; }
body.agent-premium .celerity-silk { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; opacity: .85; z-index: 1; }
body.agent-premium .brand-mascot { display: block; width: 118px; height: 118px; object-fit: contain; margin: 0 auto 20px; }
body.agent-premium .agent-scene-fallback img { width: 100%; height: 100%; object-fit: contain; }
body.agent-premium .agent-sculpture-fallback { padding: 0; }
body.agent-premium .agent-example { min-height: 105px; }
@media(min-width:1600px) {
 body.spatial-site.agent-premium .agent-hero { min-height: 760px; padding-block: 84px; }
 body.agent-premium .agent-sculpture-stage { height: 410px; }
}
@media(max-width:1100px) {
 body.agent-premium .agent-hero-grid { gap: 30px; }
 body.agent-premium .agent-sculpture-stage { height: 320px; }
}
@media(max-width:800px) {
 body.spatial-site.agent-premium .agent-hero { min-height: 0; padding: 48px 0 62px; }
 body.agent-premium .agent-hero-grid { grid-template-columns: 1fr; gap: 34px; }
 body.agent-premium .agent-sculpture-figure { max-width: 520px; padding: 15px 16px 21px; }
 body.agent-premium .agent-sculpture-stage { height: 330px; margin: 0 -10px; }
 body.agent-premium .celerity-silk { opacity: .48; }
 body.agent-premium .agent-hero .agent-actions { flex-direction: row; align-items: center; }
}
@media(max-width:520px) {
 body.agent-premium .agent-hero .agent-actions { flex-direction: column; align-items: flex-start; gap: 16px; }
 body.agent-premium .agent-hero h1 { font-size: clamp(2.6rem,10vw,3.3rem); line-height: 1.12; }
 body.agent-premium .agent-hero .agent-lede { font-size: 16px; line-height: 1.8; margin-top: 22px; }
 body.agent-premium .agent-hero .agent-personal { margin-top: 19px; font-size: 12px; }
 body.agent-premium .agent-sculpture-stage { height: 265px; }
 body.agent-premium .agent-example { min-height: 112px; }
 body.agent-premium .brand-mascot { width: 96px; height: 96px; }
}