/* v54.8 · Applied AI: How we build agents (page-scoped) */
.agx{--ink:#0e1028;--blue:#0a3a8c;--petrol:#0891b2;--petrol-t:#0e7490;--petrol-lt:#7fd3e6;--ice:#f3f4fa;--line:#c9cfe2;--label:#5a6288;--slate:#4a5278;--soft:#c7cde0;
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);--hair:rgba(201,207,226,.2);
  color:var(--ink);font-family:"DM Sans",system-ui,sans-serif}
.agx *{box-sizing:border-box;margin:0}
.agx-kicker{font:500 .8125rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--petrol-t)}
.agx h2{font-family:"Outfit Variable","Outfit",system-ui,sans-serif;font-weight:700;font-size:clamp(2rem,1.6rem + 2vw,3rem);line-height:1.06;letter-spacing:-.02em;margin:.8rem 0 1rem;max-width:20ch}
.agx h2 .dot{color:var(--petrol)}
.agx-intro{font-size:1.0625rem;line-height:1.6;color:var(--slate);max-width:60ch}

/* ---------- stepper ---------- */
.agx-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:0 1.25rem;margin:2rem 0 0}
.agx-tabs button{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:.35rem;padding:1.1rem 0 1.25rem;color:var(--label);transition:color .2s ease}
.agx-tabs .bar{display:block;height:3px;background:var(--line);margin-bottom:.75rem;overflow:hidden}
.agx-tabs .bar i{display:block;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}
.agx-tabs button[aria-selected=true] .bar i{background:var(--petrol)}
.agx-tabs .n{font:500 .75rem/1 "DM Mono",monospace;letter-spacing:.06em}
.agx-tabs .nm{font-family:"Outfit Variable","Outfit",sans-serif;font-weight:600;font-size:1.125rem;line-height:1.2;color:var(--ink);opacity:.5;transition:opacity .2s ease}
.agx-tabs .sb{font-size:.875rem;line-height:1.35}
.agx-tabs button[aria-selected=true]{color:var(--ink)}
.agx-tabs button[aria-selected=true] .nm{opacity:1}
.agx-tabs button[aria-selected=true] .n{color:var(--petrol-t)}
@media (hover:hover) and (pointer:fine){.agx-tabs button:hover .nm{opacity:.85}}
.agx-tabs button:focus-visible{outline:2px solid var(--petrol);outline-offset:4px}

/* ---------- panel ---------- */
.agx-panel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);margin-top:.5rem;outline:none}
.agx-copy{padding:2.5rem 3rem 2.5rem 0;border-top:1px solid var(--line)}
.agx-label{font:500 .75rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--petrol-t);margin-bottom:1rem}
.agx h3{font-family:"Outfit Variable","Outfit",sans-serif;font-weight:700;font-size:clamp(1.5rem,1.3rem + 1vw,2rem);line-height:1.15;letter-spacing:-.015em;margin-bottom:1rem}
.agx-body{font-size:1.0625rem;line-height:1.6;color:var(--slate);max-width:46ch}
.agx-gain{margin-top:2rem;padding-inline-start:1rem;box-shadow:inset 3px 0 0 var(--petrol)}
.agx-gain span{display:block;font:500 .75rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--label);margin-bottom:.5rem}
.agx-gain strong{font-weight:700;font-size:1.0625rem;line-height:1.45}

/* ---------- artefact slab ---------- */
.agx-art{min-height:33rem;background:var(--ink);color:#fff;padding:2.25rem 2.5rem 2.5rem;display:flex;flex-direction:column;overflow:hidden}
.agx-art-label{display:flex;justify-content:space-between;font:500 .75rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}

.agx-case{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.1rem;padding:.75rem 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);font:500 .78rem/1.3 "DM Mono",monospace;letter-spacing:.04em;color:#fff}
.agx-status{padding:.35rem .6rem;border:1px solid var(--petrol);color:var(--petrol-lt);white-space:nowrap;text-transform:uppercase;letter-spacing:.06em;font-size:.7rem}
.agx-art-title{font-family:"Outfit Variable","Outfit",sans-serif;font-weight:600;font-size:1.375rem;line-height:1.25;margin:1.4rem 0;max-width:30ch}
.agx-art-body{flex:1;display:flex;flex-direction:column;gap:.6rem}

.agx-art .row{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;padding:.85rem 1rem;border:1px solid var(--hair);background:rgba(255,255,255,.03)}
.agx-art .row b{font-weight:500;font-size:.98rem;line-height:1.35}
.agx-art .row em,.agx-art .meas em,.agx-art .comp em{font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;font-style:normal;color:var(--soft);white-space:nowrap}
.agx-art .row.sig{border-color:var(--petrol);box-shadow:inset 3px 0 0 var(--petrol)}
.agx-art .row.sig em{color:var(--petrol-lt)}

/* 01 baseline measures + 06 comparison */
.agx-art .meas,.agx-art .comp{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) 4.5rem;gap:1rem;align-items:center;padding:.8rem 0;border-bottom:1px solid var(--hair);font-size:.95rem}
.agx-art .track{position:relative;display:block;height:10px}
.agx-art .track .fill,.agx-art .track .ghost{position:absolute;left:0;top:0;height:100%;width:var(--w);transform-origin:left}
.agx-art .meas .fill{background:var(--soft)}
.agx-art .comp .ghost{left:var(--w);width:2px;top:-4px;height:18px;background:var(--soft);transform:translateX(-1px)}
.agx-art .comp .fill{background:#fff;height:6px;top:2px}
.agx-art .comp em{text-align:end;color:#fff}
.agx-art .meas em{text-align:end}
.agx-art .legend{display:flex;gap:1.5rem;font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin-bottom:.25rem}
.agx-art .legend span{display:inline-flex;align-items:center;gap:.5rem}
.agx-art .lg-ghost{width:2px;height:14px;background:var(--soft)}
.agx-art .lg-fill{width:18px;height:6px;background:#fff}
.agx-art .meas + .row.sig,.agx-art .comp + .row.sig{margin-top:.9rem}

/* 02 roles + hand-off */
.agx-art .cols{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.agx-art .col{position:relative;border:1px solid var(--hair);padding:1rem 1rem 4rem;display:flex;flex-direction:column;gap:.6rem;min-height:12.5rem}
.agx-art .col em{font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;font-style:normal;color:var(--soft)}
.agx-art .col b{font-weight:500;line-height:1.4;font-size:.98rem}
.agx-art .col.sig{border-color:var(--petrol)}
.agx-art .col.sig em{color:var(--petrol-lt)}
.agx-art .topbar{position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:var(--petrol);transform-origin:left}
.agx-art .handoff{position:absolute;left:1rem;bottom:1rem;width:calc((100% - 1.2rem) / 3 - 2rem);padding:.45rem .6rem;background:var(--petrol);color:var(--ink);font:500 .7rem/1.2 "DM Mono",monospace;letter-spacing:.04em;text-transform:uppercase}
.agx-art .cols + .row{margin-top:.6rem}

/* 03 match links */
.agx-art .link{display:flex;align-items:center;gap:.75rem;height:2.1rem;padding-inline-start:1.4rem;margin:-.6rem 0}
.agx-art .link i{width:1px;height:100%;background:var(--petrol-lt);transform-origin:top}
.agx-art .link span{font:500 .7rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--petrol-lt)}

/* 04 reading the reply */
.agx-art .mail{border:1px solid var(--hair);padding:1rem 1.1rem;font-size:1.05rem;line-height:1.55;margin-bottom:.4rem}
.agx-art .mail small{display:block;font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin-bottom:.6rem}
.agx-art .hl{position:relative;white-space:nowrap}
.agx-art .hl::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--petrol);transform-origin:left;animation:agx-grow .6s var(--ease-io) both;animation-delay:var(--d,0ms)}

/* 05 inbox */
.agx-art .inbox{font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin-bottom:.15rem}
.agx-art .row em.a-pop{display:inline-block;padding:.3rem .5rem;border:1px solid var(--soft);color:#fff}



/* ---------- the agent, defined: identity card + definition that fills stage by stage ---------- */
.agx-card{display:flex;align-items:center;gap:.9rem}
.av{width:52px;height:52px;flex:none;overflow:visible}
.av *{transform-box:fill-box;transform-origin:center}
.av-fr{fill:#161a38;stroke:var(--petrol-lt);stroke-width:1.5}
.av-tx{font:500 15px "DM Mono",monospace;letter-spacing:.04em;fill:#fff;text-anchor:middle}
.av-dot{fill:var(--petrol-lt);stroke:var(--ink);stroke-width:3}
.av-ring{fill:none;stroke:var(--petrol-lt);stroke-width:1.2;opacity:0}
/* 01 not built yet: ghost outline, marching dashes, no presence */
.av.st-scope .av-fr{fill:none;stroke:rgba(199,205,224,.6);stroke-dasharray:4 4;animation:g-march 1.2s linear infinite}
.av.st-scope .av-tx{fill:var(--soft);opacity:.55}
.av.st-scope .av-dot{fill:var(--ink);stroke:rgba(199,205,224,.6);stroke-width:1.5}
/* 02 role defined: outline draws solid once, presence appears (idle) */
.av.st-role .av-fr{stroke-dasharray:200;animation:av-draw 1s var(--ease-io) both}
.av.st-role .av-dot{fill:var(--soft);animation:av-pop .3s var(--ease-out) .8s both}
/* 03 connecting: presence goes live */
.av.st-link .av-dot{animation:av-pop .3s var(--ease-out) both}
/* 04 working: presence pulses with a ripple */
.av.st-read .av-ring,.av.st-run .av-ring{animation:g-ring 1.8s var(--ease-out) infinite}
.av.st-read .av-dot{animation:g-pulse 1.8s ease-in-out infinite}
/* 05 on duty: calm, steady ripple */
.av.st-run .av-ring{animation-duration:2.6s}
/* 06 measured: presence becomes a confirmed state */
.av.st-measure .av-dot{fill:#fff}
@keyframes av-draw{from{stroke-dashoffset:200}to{stroke-dashoffset:0}}
@keyframes av-pop{from{transform:scale(.4);opacity:0}}
.ac-id{min-width:0}
.ac-name{font-family:"Outfit Variable","Outfit",sans-serif;font-weight:600;font-size:1.0625rem;line-height:1.2;color:#fff}
.ac-sub{font:500 .7rem/1.3 "DM Mono",monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin-top:.3rem}

.agx-def{display:flex;align-items:center;gap:.6rem;margin-top:1.1rem;flex-wrap:wrap}
.agx-case .ex{color:var(--petrol-lt);margin-inline-end:.6rem}
.agx-def .def-h,.agx-def .def-ill{font:500 .68rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
.agx-def .def-ill{margin-left:auto;color:var(--petrol-lt)}
.agx-def ol{list-style:none;padding:0;display:flex;gap:.35rem;flex-wrap:wrap}
.agx-def li{position:relative;overflow:hidden;font:500 .68rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;padding:.4rem .55rem;border:1px solid var(--hair);color:rgba(199,205,224,.45);transition:color .3s ease,border-color .3s ease}
.agx-def li.done{color:#fff;border-color:rgba(199,205,224,.5)}
.agx-def li.done::before{content:"✓ ";color:var(--petrol-lt)}
.agx-def li.now{color:var(--ink);border-color:var(--petrol-lt)}
.agx-def li.now::after{content:"";position:absolute;inset:0;background:var(--petrol-lt);z-index:-1;transform-origin:left;animation:agx-grow .7s var(--ease-io) .2s both}
.agx-def li{z-index:0}
/* ---------- agent activity mark (top-right of the example) ---------- */
.agx-agent{display:inline-flex;align-items:center;gap:.55rem;margin-inline-start:auto;padding:.45rem .7rem .45rem .5rem;border:1px solid var(--hair);font:500 .72rem/1 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:#fff;white-space:nowrap}
.agx-agent .glyph{width:24px;height:24px;flex:none;overflow:visible}
.glyph *{fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transform-box:fill-box;transform-origin:center}
.glyph .fr{stroke:rgba(199,205,224,.55)}
.glyph .fr.dash{stroke-dasharray:3 3;animation:g-march 1.2s linear infinite}
.glyph .mag *{stroke:var(--soft)}
.glyph .mag{transform-box:view-box;transform-origin:0 0;animation:g-search 3.2s var(--ease-io) infinite}
.glyph .dot{fill:var(--soft);stroke:none}
.glyph .dot.end{fill:none;stroke:var(--petrol-lt);stroke-width:1.2}
.glyph .tok{fill:var(--petrol-lt);stroke:none;animation:g-hand 2.4s var(--ease-io) infinite}
.glyph .blk{stroke:#fff}
.glyph .wire{stroke:var(--petrol-lt);stroke-width:2;transform-origin:left center;animation:g-wire 1.8s var(--ease-io) infinite}
.glyph .ln{stroke:rgba(199,205,224,.7)}
.glyph .scan{fill:var(--petrol-lt);stroke:none;animation:g-scan 1.6s var(--ease-io) infinite alternate}
.glyph .core{fill:var(--petrol-lt);stroke:none;animation:g-pulse 1.8s ease-in-out infinite}
.glyph .ring{stroke:var(--petrol-lt);stroke-width:1;animation:g-ring 1.8s var(--ease-out) infinite}
.glyph .axis{stroke:rgba(199,205,224,.55)}
.glyph .b1{fill:var(--soft);stroke:none}
.glyph .b2{fill:#fff;stroke:none;transform-origin:center bottom;animation:g-bar 2.4s var(--ease-io) infinite}
.glyph .tick{stroke:var(--petrol-lt);stroke-width:1.8;stroke-dasharray:8;animation:g-tick 2.4s var(--ease-out) infinite}
@keyframes g-march{to{stroke-dashoffset:-12}}
@keyframes g-search{0%,100%{transform:translate(0,0)}30%{transform:translate(4px,1px)}60%{transform:translate(1px,4px)}}
@keyframes g-hand{0%,12%{transform:translateX(0);opacity:0}22%{opacity:1}62%,85%{transform:translateX(12px);opacity:1}100%{transform:translateX(12px);opacity:0}}
@keyframes g-wire{0%,10%{transform:scaleX(0)}45%,80%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes g-scan{from{transform:translateX(0)}to{transform:translateX(16px)}}
@keyframes g-pulse{0%,100%{transform:scale(.85);opacity:.8}50%{transform:scale(1.1);opacity:1}}
@keyframes g-ring{0%{transform:scale(.9);opacity:.9}100%{transform:scale(2.4);opacity:0}}
@keyframes g-bar{0%,10%{transform:scaleY(.25)}55%,100%{transform:scaleY(1)}}
@keyframes g-tick{0%,50%{stroke-dashoffset:8}75%,100%{stroke-dashoffset:0}}
.agx.swap .agx-agent{opacity:0;filter:blur(2px);transition-duration:.16s}
.agx-agent{transition:opacity .3s var(--ease-out),filter .3s var(--ease-out)}
@media (prefers-reduced-motion:reduce){.glyph *,.av *,.agx-def li::after{animation:none!important}.glyph .tok{transform:translateX(12px)}}


/* ---------- motion ---------- */
.agx-art [class*="a-"]{animation-duration:.5s;animation-timing-function:var(--ease-out);animation-fill-mode:both;animation-delay:var(--d,0ms)}
.agx-art .a-up{animation-name:agx-up}
.agx-art .a-down{animation-name:agx-down}
.agx-art .a-left{animation-name:agx-left}
.agx-art .a-right{animation-name:agx-right}
.agx-art .a-fade{animation-name:agx-fade;animation-duration:.4s}
.agx-art .a-pop{animation-name:agx-pop;animation-duration:.3s}
.agx-art .a-grow{animation-name:agx-grow;animation-duration:.9s;animation-timing-function:var(--ease-io)}
.agx-art .a-growY{animation-name:agx-growY;animation-duration:.35s}
.agx-art .a-travel{animation-name:agx-travel;animation-duration:1.4s;animation-timing-function:var(--ease-io)}
@keyframes agx-up{from{opacity:0;transform:translateY(10px)}}
@keyframes agx-down{from{opacity:0;transform:translateY(-10px)}}
@keyframes agx-left{from{opacity:0;transform:translateX(-24px)}}
@keyframes agx-right{from{opacity:0;transform:translateX(24px)}}
@keyframes agx-fade{from{opacity:0}}
@keyframes agx-pop{from{opacity:0;transform:scale(.92)}}
@keyframes agx-grow{from{transform:scaleX(0)}}
@keyframes agx-growY{from{transform:scaleY(0)}}
@keyframes agx-travel{0%{opacity:0;transform:translateX(0)}18%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(calc(200% + 5.2rem))}}

/* keyboard / instant: final state, no choreography */
.agx-art.instant [class*="a-"],.agx-art.instant .hl::after{animation:none}

/* stage change: copy and status blur-crossfade (out fast, in with ease-out) */
.agx-copy>*,.agx-art-title,.agx-status{transition:opacity .3s var(--ease-out),filter .3s var(--ease-out),transform .3s var(--ease-out)}
.agx.swap .agx-copy>*,.agx.swap .agx-art-title,.agx.swap .agx-status{opacity:0;filter:blur(2px);transform:translateY(4px);transition-duration:.16s}
.agx-copy>*:nth-child(2){transition-delay:.03s}.agx-copy>*:nth-child(3){transition-delay:.06s}.agx-copy>*:nth-child(4){transition-delay:.09s}
.agx.swap .agx-copy>*{transition-delay:0s}

.agx-art-body{transition:opacity .25s var(--ease-out)}
.agx.swap .agx-art-body{opacity:0;transition-duration:.16s}

/* first view: the section enters once */
.agx-tabs,.agx-panel,.agx-foot{transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.agx-tabs{transition-delay:.12s}.agx-panel{transition-delay:.24s}.agx-foot{transition-delay:.36s}
.agx.pre .agx-tabs,.agx.pre .agx-panel,.agx.pre .agx-foot{opacity:0;transform:translateY(16px)}

.agx-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.9rem;color:var(--label)}
.agx-foot strong{color:var(--ink)}
.agx-play{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;font:500 .75rem/1 "DM Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);padding:.6rem .2rem;transition:transform .16s var(--ease-out)}
.agx-play:active{transform:scale(.97)}
.agx-play .ic{width:10px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.agx-play[aria-pressed=true] .ic{border:0;width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
.agx-play:focus-visible{outline:2px solid var(--petrol);outline-offset:3px}

@media (prefers-reduced-motion:reduce){
  .agx-art [class*="a-"],.agx-art .hl::after{animation:agx-fade .2s ease both;animation-delay:0s}
  .agx-copy>*,.agx-art-title,.agx-status,.agx-tabs,.agx-panel,.agx-foot{transition:opacity .2s ease;transform:none!important;filter:none!important}
  .agx-play{display:none}
}

/* ---------- tablet / mobile ---------- */
@media (max-width:1023px){
  .agx-tabs{grid-template-columns:repeat(3,1fr)}
  .agx-panel{grid-template-columns:1fr}
  .agx-copy{padding:2rem 0}
  .agx-art{min-height:0}
}
@media (max-width:640px){
  .agx-tabs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;margin-inline:calc(-1 * clamp(1rem,4vw,2rem));padding-inline:clamp(1rem,4vw,2rem);scroll-padding-inline:clamp(1rem,4vw,2rem);scrollbar-width:none}
  .agx-tabs::-webkit-scrollbar{display:none}
  .agx-tabs button{flex:0 0 46%;scroll-snap-align:start}
  .agx-art{padding:1.5rem 1.25rem 1.75rem;margin-inline:calc(-1 * clamp(1rem,4vw,2rem))}
  .agx-case{flex-direction:column;align-items:flex-start}
  .agx-card{flex-wrap:wrap}
  .agx-agent{margin-inline-start:0;flex-basis:100%;justify-content:flex-start}
  .agx-def .def-ill{margin-left:0}
  .agx-art .cols{grid-template-columns:1fr}
  .agx-art .col{min-height:0;padding-bottom:1rem}
  .agx-art .handoff{display:none}
  .agx-art .row{grid-template-columns:1fr}
  .agx-art .meas,.agx-art .comp{grid-template-columns:1fr auto;row-gap:.5rem}
  .agx-art .meas span,.agx-art .comp span{grid-column:1/-1}
  .agx-foot{flex-direction:column;align-items:flex-start}
}

/* ---------- Hebrew / RTL (he.css loads Heebo; physical directions mirrored here) ---------- */
[dir=rtl] .agx,[dir=rtl] .agx *:not(.av-tx){font-family:"Heebo Variable","Heebo","Assistant",system-ui,sans-serif;letter-spacing:0}
[dir=rtl] .agx .agx-tabs .nm,[dir=rtl] .agx h3,[dir=rtl] .agx .ac-name,[dir=rtl] .agx .agx-art-title{font-weight:700}
[dir=rtl] .agx-copy{padding:2.5rem 0 2.5rem 3rem}
[dir=rtl] .agx-gain{box-shadow:inset -3px 0 0 var(--petrol)}
[dir=rtl] .agx-art .row.sig{box-shadow:inset -3px 0 0 var(--petrol)}
[dir=rtl] .agx-tabs .bar i,[dir=rtl] .agx-art .track .fill,[dir=rtl] .agx-art .topbar,[dir=rtl] .agx-art .hl::after,[dir=rtl] .agx-def li.now::after{transform-origin:right}
[dir=rtl] .agx-art .track .fill,[dir=rtl] .agx-art .track .ghost{left:auto;right:0}
[dir=rtl] .agx-art .comp .ghost{right:var(--w);transform:translateX(1px)}
[dir=rtl] .agx-art .handoff{left:auto;right:1rem}
[dir=rtl] .agx-art .a-left{animation-name:agx-right}
[dir=rtl] .agx-art .a-right{animation-name:agx-left}
[dir=rtl] .agx-art .a-travel{animation-name:agx-travel-rtl}
@keyframes agx-travel-rtl{0%{opacity:0;transform:translateX(0)}18%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(calc(-200% - 5.2rem))}}
[dir=rtl] .glyph.g-read,[dir=rtl] .glyph.g-role{transform:scaleX(-1)}
@media (max-width:1023px){[dir=rtl] .agx-copy{padding:2rem 0}}

/* ---------- ways in: hero link + service-02 teaser ---------- */
.v548-hero-link{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.5rem;color:#fff;font-weight:500;text-decoration:none;padding-bottom:.2rem;box-shadow:inset 0 -2px 0 #0891b2;transition:box-shadow .2s ease}
.v548-hero-link span{transition:transform .2s cubic-bezier(.23,1,.32,1)}
@media (hover:hover) and (pointer:fine){.v548-hero-link:hover{box-shadow:inset 0 -4px 0 #0891b2}.v548-hero-link:hover span{transform:translateY(2px)}}
.v548-hero-link:focus-visible{outline:2px solid #0891b2;outline-offset:4px}

.agx-teaser{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.8rem .9rem;margin-top:1.25rem;padding:.85rem 1rem;background:#0e1028;color:#fff;text-decoration:none;border-radius:var(--radius-sm,8px);transition:transform .16s cubic-bezier(.23,1,.32,1)}
.agx-teaser:active{transform:scale(.98)}
.agx-teaser:focus-visible{outline:2px solid #0891b2;outline-offset:3px}
.agx-teaser__av{position:relative;display:grid;place-items:center;width:38px;height:38px;border:1.5px solid #7fd3e6;border-radius:9px;background:#161a38;font:500 12px/1 "DM Mono",monospace;letter-spacing:.04em}
.agx-teaser__av i{position:absolute;right:-4px;bottom:-4px;width:10px;height:10px;border-radius:50%;background:#7fd3e6;border:2px solid #0e1028}
.agx-teaser__av[data-g=scope]{border-style:dashed;border-color:rgba(199,205,224,.6)}
.agx-teaser__av[data-g=scope] i{background:#0e1028;border-color:rgba(199,205,224,.6)}
.agx-teaser__av[data-g=read] i,.agx-teaser__av[data-g=run] i{animation:g-pulse 1.8s ease-in-out infinite}
.agx-teaser__txt{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.agx-teaser__txt b{font-weight:600;font-size:.95rem;line-height:1.25}
.agx-teaser__st{font:500 .7rem/1.2 "DM Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:#7fd3e6;transition:opacity .18s ease,filter .18s ease}
.agx-teaser.swap .agx-teaser__st{opacity:0;filter:blur(2px)}
.agx-teaser__go{grid-column:1/-1;font-size:.9rem;font-weight:500;white-space:nowrap;padding-top:.7rem;border-top:1px solid rgba(201,207,226,.25)}
.agx-teaser__go span{display:inline-block;transition:transform .2s cubic-bezier(.23,1,.32,1)}
@media (hover:hover) and (pointer:fine){.agx-teaser:hover .agx-teaser__go span{transform:translateX(3px)}[dir=rtl] .agx-teaser:hover .agx-teaser__go span{transform:translateX(-3px)}}
[dir=rtl] .agx-teaser__av i{right:auto;left:-4px}
[dir=rtl] .agx-teaser,[dir=rtl] .agx-teaser *:not(.agx-teaser__av){font-family:"Heebo Variable","Heebo",system-ui,sans-serif;letter-spacing:0}
@media (prefers-reduced-motion:reduce){.agx-teaser__av i{animation:none!important}.agx-teaser.swap .agx-teaser__st{opacity:1;filter:none}}
