/* ArtemisX landing — design tokens + components
   Ported from the Claude Design source (ArtemisX.dc.html). */

*{box-sizing:border-box}
html,body{margin:0;padding:0}

:root,[data-theme="dark"]{
  --bg:#08090D;--panel:#0b0c11;--panel-hover:#111218;--fg:#F4F1EA;
  --fg-72:rgba(244,241,234,.72);--fg-70:rgba(244,241,234,.7);--fg-68:rgba(244,241,234,.68);
  --fg-66:rgba(244,241,234,.66);--fg-60:rgba(244,241,234,.6);--fg-55:rgba(244,241,234,.55);
  --fg-50:rgba(244,241,234,.5);--fg-40:rgba(244,241,234,.4);
  --bd-30:rgba(244,241,234,.3);--bd-28:rgba(244,241,234,.28);--bd-25:rgba(244,241,234,.25);
  --bd-16:rgba(244,241,234,.16);--bd-14:rgba(244,241,234,.14);--bd-12:rgba(244,241,234,.12);
  --bd-10:rgba(244,241,234,.1);--bd-08:rgba(244,241,234,.08);--bd-15:rgba(244,241,234,.15);
  --inv-60:rgba(8,9,13,.6);--inv-55:rgba(8,9,13,.62);--inv-40:rgba(8,9,13,.42);
  --inv-bd12:rgba(8,9,13,.12);--inv-bd10:rgba(8,9,13,.1);
  --scrim:rgba(8,9,13,.4);--nav-bg:rgba(8,9,13,.72);--nav-bd:rgba(244,241,234,.08);
  --side-fade:rgba(8,9,13,.55);
}
[data-theme="light"]{
  --bg:#F4F1EA;--panel:#ffffff;--panel-hover:#ece8dd;--fg:#08090D;
  --fg-72:rgba(8,9,13,.75);--fg-70:rgba(8,9,13,.72);--fg-68:rgba(8,9,13,.7);
  --fg-66:rgba(8,9,13,.68);--fg-60:rgba(8,9,13,.6);--fg-55:rgba(8,9,13,.55);
  --fg-50:rgba(8,9,13,.5);--fg-40:rgba(8,9,13,.45);
  --bd-30:rgba(8,9,13,.28);--bd-28:rgba(8,9,13,.24);--bd-25:rgba(8,9,13,.2);
  --bd-16:rgba(8,9,13,.16);--bd-14:rgba(8,9,13,.14);--bd-12:rgba(8,9,13,.12);
  --bd-10:rgba(8,9,13,.1);--bd-08:rgba(8,9,13,.08);--bd-15:rgba(8,9,13,.12);
  --inv-60:rgba(244,241,234,.6);--inv-55:rgba(244,241,234,.6);--inv-40:rgba(244,241,234,.45);
  --inv-bd12:rgba(244,241,234,.14);--inv-bd10:rgba(244,241,234,.1);
  --scrim:rgba(244,241,234,.5);--nav-bg:rgba(244,241,234,.8);--nav-bd:rgba(8,9,13,.08);
  --side-fade:rgba(244,241,234,.55);
}

:root{
  --accent:#FF5A36;
  --violet:#745CFF;
  --green:#B8FF57;
  --sans:'Geist',sans-serif;
  --display:'General Sans',sans-serif;
  --mono:'Geist Mono',monospace;
  --gutter:clamp(20px,5vw,64px);
  --ease:cubic-bezier(.22,1,.36,1);
}

body{
  background:var(--bg);color:var(--fg);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  transition:background .5s ease,color .5s ease;
}
::selection{background:var(--accent);color:#08090D}
a{color:var(--accent);text-decoration:none}
a:hover{color:#ff7a5e}
.accent{color:var(--accent)}
.mono{font-family:var(--mono)}

/* ---------------------------------------------------------------- reveals */

html.ax-anim [data-reveal]{
  opacity:0;transform:translateY(28px);
  transition:opacity .9s var(--ease),transform .9s var(--ease);
}
html.ax-anim [data-reveal].ax-in{opacity:1;transform:none}
[data-reveal-delay="1"]{transition-delay:.08s}
[data-reveal-delay="2"]{transition-delay:.16s}
[data-reveal-delay="3"]{transition-delay:.24s}
[data-reveal-delay="4"]{transition-delay:.32s}

/* ---------------------------------------------------------------- keyframes */

@keyframes ax-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.6)}}
@keyframes ax-scrollcue{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(14px);opacity:0}}
@keyframes ax-spin{to{transform:rotate(360deg)}}
@keyframes ax-glow{0%,100%{opacity:.35;transform:scale(.9)}50%{opacity:.85;transform:scale(1.15)}}
@keyframes ax-glow2{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.25)}}
@keyframes ax-ember{0%{transform:translateY(0) translateX(0);opacity:0}12%{opacity:.9}100%{transform:translateY(-140px) translateX(24px);opacity:0}}

/* ---------------------------------------------------------------- ship stage */

.ship-stage{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:var(--bg)}
.ship-img{
  position:absolute;top:50%;left:58%;width:min(72vw,1100px);
  transform:translate(-50%,-50%);will-change:transform;
  filter:saturate(1.05) contrast(1.02);transition:none;
}
.ship-fx{position:absolute;top:50%;left:58%;width:min(72vw,1100px);height:0;transform:translate(-50%,-50%)}

.glowdot{position:absolute;border-radius:50%;mix-blend-mode:screen}
.glowdot--a{left:33%;top:-2%;width:60px;height:60px;background:radial-gradient(circle,rgba(255,214,140,.9),transparent 65%);animation:ax-glow2 3.1s ease-in-out infinite}
.glowdot--b{left:41%;top:-3%;width:52px;height:52px;background:radial-gradient(circle,rgba(200,220,255,.85),transparent 65%);animation:ax-glow 2.6s ease-in-out .4s infinite}
.glowdot--c{left:12%;top:-14%;width:70px;height:70px;background:radial-gradient(circle,rgba(255,170,90,.75),transparent 62%);animation:ax-glow2 4.2s ease-in-out .8s infinite}
.glowdot--d{left:73%;top:-16%;width:66px;height:66px;background:radial-gradient(circle,rgba(255,170,90,.75),transparent 62%);animation:ax-glow 3.7s ease-in-out 1.1s infinite}

.ember{position:absolute;border-radius:50%}
.ember--1{left:20%;top:8%;width:4px;height:4px;background:#FFCF8C;animation:ax-ember 5s linear infinite}
.ember--2{left:47%;top:12%;width:3px;height:3px;background:#FFB36B;animation:ax-ember 6.4s linear 1.2s infinite}
.ember--3{left:63%;top:6%;width:5px;height:5px;background:#FFCF8C;animation:ax-ember 5.6s linear 2.1s infinite}
.ember--4{left:80%;top:10%;width:3px;height:3px;background:#FFB36B;animation:ax-ember 7s linear .6s infinite}
.ember--5{left:35%;top:4%;width:4px;height:4px;background:#B8FF57;animation:ax-ember 6s linear 3s infinite}

.ship-vignette{position:absolute;inset:0;background:radial-gradient(120% 90% at 60% 45%,transparent 38%,var(--bg) 82%)}
.ship-sidefade{position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,var(--side-fade) 34%,transparent 62%)}
.ship-scrim{position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 26%,transparent 78%,var(--bg) 100%)}

/* ---------------------------------------------------------------- loader */

.loader{
  position:fixed;inset:0;z-index:100;background:var(--bg);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;
  transition:opacity .7s ease,visibility .7s;
}
.loader.is-hidden{opacity:0;visibility:hidden}
.loader__spinner{width:34px;height:34px;border:2px solid var(--bd-15);border-top-color:var(--accent);border-radius:50%;animation:ax-spin 1s linear infinite}
.loader__label{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--fg-50)}

/* ---------------------------------------------------------------- nav */

.nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px var(--gutter);border-bottom:1px solid transparent;color:var(--fg);
  transition:background .4s ease,border-color .4s ease,color .4s,backdrop-filter .4s;
}
.nav.is-solid{
  background:var(--nav-bg);border-bottom-color:var(--nav-bd);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.nav.is-over-band{color:var(--bg)}

.brand{display:flex;align-items:center;gap:11px;color:inherit}
.brand__mark{width:14px;height:14px;background:var(--accent);display:inline-block;transform:rotate(45deg)}
.brand__name{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:.01em}
.brand--sm{color:var(--fg)}
.brand--sm .brand__mark{width:13px;height:13px}
.brand--sm .brand__name{font-size:18px}

.nav__links{display:flex;align-items:center;gap:30px;font-size:14px}
.nav__links a{color:inherit;opacity:.82}
.nav__links a:hover{opacity:1}
.nav__actions{display:flex;align-items:center;gap:10px}

.iconbtn{
  background:transparent;border:1px solid var(--bd-25);color:inherit;border-radius:9px;
  height:40px;cursor:pointer;font-family:var(--mono);font-size:12px;letter-spacing:.06em;
  display:inline-flex;align-items:center;justify-content:center;padding:0 12px;
  transition:border-color .3s,background .3s;
}
.iconbtn:hover{border-color:var(--accent)}
.iconbtn--square{width:40px;padding:0;font-size:15px}
.iconbtn--burger{display:none;width:42px;flex-direction:column;gap:4px;padding:0}
.iconbtn--burger span{width:16px;height:1.5px;background:currentColor;display:block}

/* ---------------------------------------------------------------- buttons */

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:11px;font-weight:500;font-size:16px;padding:16px 30px}
.btn--accent{background:var(--accent);color:#08090D}
.btn--accent:hover{color:#08090D}
.btn--ghost{border:1px solid var(--bd-28);color:var(--fg);backdrop-filter:blur(6px)}
.btn--ghost:hover{color:var(--fg);border-color:var(--bd-30)}
.btn--sm{font-size:14px;padding:10px 20px;border-radius:9px}
.btn--lg{font-size:17px;padding:18px 38px;border-radius:12px;gap:11px}

.textlink{display:inline-flex;align-items:center;gap:10px;color:var(--fg);font-size:16px;padding-bottom:5px}
.textlink:hover{color:var(--fg)}
.textlink--violet{border-bottom:1px solid var(--violet)}
.textlink--violet .mono{color:var(--violet)}
.textlink--accent{border-bottom:1px solid var(--accent)}
.textlink--accent .mono{color:var(--accent)}

/* ---------------------------------------------------------------- mobile menu */

.mobilemenu{
  position:fixed;inset:0;z-index:59;background:var(--bg);display:none;
  flex-direction:column;padding:96px var(--gutter) 40px;gap:6px;
}
.mobilemenu.is-open{display:flex}
.mobilemenu a{
  color:var(--fg);font-family:var(--display);font-weight:600;font-size:32px;
  padding:14px 0;border-bottom:1px solid var(--bd-10);
}
.mobilemenu__cta{
  margin-top:24px;text-align:center;background:var(--accent);color:#08090D !important;
  padding:16px;border-radius:11px;font-weight:500;font-size:16px;border-bottom:0 !important;
}

/* ---------------------------------------------------------------- layout */

.content{position:relative;z-index:10}
.wrap{max-width:1280px;margin:0 auto;width:100%}
.wrap--padded{padding:0 var(--gutter)}
.stack-50{display:grid;grid-template-columns:1fr;gap:50px}
.section{min-height:100vh;padding:100px var(--gutter)}
.section--center{display:flex;align-items:center}
.section--right{justify-content:flex-end}
.col-600{max-width:600px}
.col--right{text-align:right}
.band{background:var(--bg);color:var(--fg);padding:clamp(80px,12vh,160px) var(--gutter);position:relative;z-index:20}
.band--flush{padding-left:0;padding-right:0}
.band--inverse{background:var(--fg);color:var(--bg)}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:60px}
.band .two-col{align-items:center}

/* ---------------------------------------------------------------- type */

.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:22px}
.eyebrow--accent{color:var(--accent)}
.eyebrow--violet{color:var(--violet);margin-bottom:20px}
.eyebrow--green{color:var(--green)}

.h2{font-family:var(--display);font-weight:600;line-height:.95;letter-spacing:-.03em;margin:0;font-size:clamp(42px,6.5vw,92px)}
.h2--xl{font-size:clamp(40px,7vw,104px);line-height:.94}
.h2--lg{font-size:clamp(40px,6vw,88px);max-width:900px}
.h2--md{font-size:clamp(40px,5.5vw,80px)}
.h2--sm{font-size:clamp(36px,5vw,72px);line-height:.96;margin-bottom:12px}
.h2--gap{font-size:clamp(38px,5vw,72px);margin-bottom:50px;max-width:800px}

.lede{font-size:clamp(15px,1.5vw,18px);line-height:1.6;color:var(--fg-66);max-width:540px;margin:28px 0 0}
.lede--narrow{color:var(--fg-68);max-width:460px;margin:26px 0 0}
.lede--push{color:var(--fg-68);max-width:480px;margin:26px 0 0 auto}
.lede--tight{max-width:440px;margin:26px 0 0}

/* ---------------------------------------------------------------- hero */

.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:120px var(--gutter) 60px;position:relative}
.hero__inner{max-width:1000px}
.hero__h1{font-family:var(--display);font-weight:600;font-size:clamp(52px,10vw,150px);line-height:.92;letter-spacing:-.035em;margin:0;text-wrap:balance}
.hero__sub{font-size:clamp(16px,1.9vw,21px);line-height:1.5;color:var(--fg-72);max-width:520px;margin:30px 0 0}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}

.badge{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--fg-60);
  border:1px solid var(--bd-14);padding:7px 14px;border-radius:30px;margin-bottom:34px;
  background:var(--scrim);backdrop-filter:blur(6px);
}
.badge__num{color:var(--green)}

.dot{width:6px;height:6px;border-radius:50%;background:var(--green);flex:none}
.dot--sm{width:5px;height:5px}
.dot--pulse{width:7px;height:7px;box-shadow:0 0 8px var(--green);animation:ax-pulse 2.4s ease-in-out infinite}

.scrollcue{
  position:absolute;bottom:34px;right:var(--gutter);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--fg-40);
}
.scrollcue__rail{width:1px;height:34px;background:linear-gradient(var(--fg-40),transparent);position:relative;overflow:hidden}
.scrollcue__dot{position:absolute;top:0;left:0;width:1px;height:10px;background:var(--accent);animation:ax-scrollcue 2s ease-in-out infinite}

/* ---------------------------------------------------------------- intro cards */

.grid-hairline{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;
  background:var(--bd-10);border:1px solid var(--bd-10);border-radius:16px;overflow:hidden;
}
.introcard{padding:26px;background:var(--panel);color:var(--fg);display:block;transition:background .3s}
.introcard:hover{background:var(--panel-hover);color:var(--fg)}
.introcard__idx{font-family:var(--mono);font-size:11px;color:var(--violet);letter-spacing:.1em}
.introcard__title{font-family:var(--display);font-weight:600;font-size:22px;margin:12px 0 6px}
.introcard__desc{font-size:13.5px;color:var(--fg-55);line-height:1.5}

/* ---------------------------------------------------------------- feature grid */

.featgrid{display:grid;grid-template-columns:1fr 1fr;margin:36px 0;border-top:1px solid var(--bd-12)}
.feat{padding:15px 0;border-bottom:1px solid var(--bd-10);display:flex;align-items:center;gap:11px;font-size:14.5px}
.feat--last{border-bottom:0}

/* ---------------------------------------------------------------- pills */

.pills{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin:34px 0}
.pill{border:1px solid var(--bd-16);border-radius:30px;padding:8px 16px;font-size:13.5px}

/* ---------------------------------------------------------------- stats band */

.statgrid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;
  background:var(--inv-bd12);border:1px solid var(--inv-bd12);border-radius:16px;overflow:hidden;margin-top:56px;
}
.stat{background:var(--fg);padding:30px 26px}
.stat__num{font-family:var(--display);font-weight:600;font-size:clamp(38px,4.5vw,60px);letter-spacing:-.03em}
.stat__label{font-size:13.5px;color:var(--inv-55);margin-top:8px}
.stat__tag{font-family:var(--mono);font-size:9.5px;color:var(--inv-40);margin-top:6px;letter-spacing:.06em}
.band__note{font-family:var(--mono);font-size:11px;color:var(--inv-40);margin-top:16px;letter-spacing:.04em}

/* ---------------------------------------------------------------- perf panel */

.panel{border:1px solid var(--bd-12);border-radius:16px;overflow:hidden;background:var(--panel)}
.panel__row{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 22px;border-bottom:1px solid var(--bd-10);
  font-family:var(--mono);font-size:12px;
}
.panel__row--stack{display:block}
.panel__row--last{border-bottom:0}
.panel__key{color:var(--fg-55)}
.panel__val--green{color:var(--green)}
.panel__val--status{display:inline-flex;align-items:center;gap:8px;color:var(--green)}
.panel__barhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.bar{height:5px;border-radius:3px;background:var(--bd-10);overflow:hidden}
.bar__fill{height:100%;width:0;background:linear-gradient(90deg,var(--violet),var(--accent));border-radius:3px;transition:width 1.6s var(--ease)}

/* ---------------------------------------------------------------- use cases */

.uctrack{
  display:flex;gap:18px;overflow-x:auto;padding:44px var(--gutter);
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
}
.uccard{
  scroll-snap-align:start;flex:0 0 300px;border:1px solid var(--bd-12);border-radius:16px;
  padding:26px;background:var(--panel);min-height:230px;display:flex;flex-direction:column;
}
.uccard__tag{font-family:var(--mono);font-size:11px;letter-spacing:.08em}
.uccard__tag--violet{color:var(--violet)}
.uccard__tag--accent{color:var(--accent)}
.uccard__tag--green{color:var(--green)}
.uccard__title{font-family:var(--display);font-weight:600;font-size:22px;margin:14px 0 10px}
.uccard__desc{font-size:14px;color:var(--fg-60);line-height:1.55;margin-top:auto}

/* ---------------------------------------------------------------- trust */

.trustlist{display:flex;flex-direction:column;border-top:1px solid var(--bd-12)}
.trust{padding:22px 0;border-bottom:1px solid var(--bd-10)}
.trust--last{border-bottom:0}
.trust__title{font-family:var(--display);font-weight:600;font-size:18px}
.trust__desc{font-size:14px;color:var(--fg-55);margin-top:6px}

/* ---------------------------------------------------------------- pricing */

.pricegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.plan{
  border:1px solid var(--bd-14);border-radius:18px;padding:32px;background:var(--panel);
  display:flex;flex-direction:column;position:relative;
}
.plan--featured{border-color:var(--accent);background:linear-gradient(180deg,rgba(255,90,54,.08),var(--panel) 40%)}
.plan__badge{
  position:absolute;top:-11px;left:32px;background:var(--accent);color:#08090D;
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;padding:5px 11px;border-radius:20px;
}
.plan__kicker{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;letter-spacing:.08em}
.plan__kicker--violet{color:var(--violet)}
.plan__kicker--accent{color:var(--accent)}
.plan__price{font-family:var(--display);font-weight:600;font-size:30px;letter-spacing:-.02em;margin:20px 0 4px}
.plan__amount{border-bottom:1px dashed var(--bd-30)}
.plan__unit{font-size:16px;color:var(--fg-50)}
.plan__best{font-size:13.5px;color:var(--fg-55);margin-bottom:22px}
.plan__feats{display:flex;flex-direction:column;gap:11px;font-size:14px;margin-bottom:26px}
.plan__feats > div{display:flex;gap:10px;align-items:center}
.plan__cta{margin-top:auto;text-align:center;font-weight:500;padding:14px;border-radius:11px;font-size:15px}
.plan__cta--solid{background:var(--fg);color:var(--bg)}
.plan__cta--solid:hover{color:var(--bg)}
.plan__cta--accent{background:var(--accent);color:#08090D}
.plan__cta--accent:hover{color:#08090D}
.plan__more{text-align:center;font-size:13px;color:var(--fg-55);margin-top:12px}
.plan__more:hover{color:var(--fg)}

/* ---------------------------------------------------------------- final cta */

.final{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:120px var(--gutter);position:relative;
}
.final .eyebrow{margin-bottom:28px}
.final__h2{font-family:var(--display);font-weight:600;font-size:clamp(44px,8vw,124px);line-height:.92;letter-spacing:-.035em;margin:0;text-wrap:balance}
.final__sub{font-size:clamp(16px,1.7vw,20px);line-height:1.55;color:var(--fg-70);max-width:520px;margin:30px 0 0}
.final .btn--lg{margin-top:44px}

/* ---------------------------------------------------------------- footer */

.footer{position:relative;z-index:20;background:var(--bg);border-top:1px solid var(--bd-10);padding:70px var(--gutter) 40px}
.footer__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:40px 30px}
.footer__brandcol{grid-column:span 2;min-width:200px}
.footer__tag{font-size:14px;color:var(--fg-50);max-width:260px;margin:18px 0 0;line-height:1.55}
.statuspill{
  display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  font-family:var(--mono);font-size:12px;color:var(--green);
  border:1px solid rgba(184,255,87,.25);padding:8px 14px;border-radius:30px;
}
.footer__head{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-40);margin-bottom:16px}
.footer__links{display:flex;flex-direction:column;gap:11px;font-size:14px}
.footer__links a{color:var(--fg-72)}
.footer__links a:hover{color:var(--fg)}
.footer__bottom{
  display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;
  margin-top:54px;padding-top:26px;border-top:1px solid var(--bd-10);font-size:12.5px;color:var(--fg-40);
}
.footer__social{display:flex;gap:20px}
.footer__social a{color:var(--fg-60)}
.footer__social a:hover{color:var(--fg)}

/* ---------------------------------------------------------------- responsive */

@media (max-width:1023px){
  .nav__links{display:none}
  .desk-only{display:none}
  .iconbtn--burger{display:inline-flex}
}

@media (max-width:600px){
  .featgrid{grid-template-columns:1fr}
  .feat{border-bottom:1px solid var(--bd-10)}
  .col--right{text-align:left}
  .pills{justify-content:flex-start}
  .lede--push{margin-left:0}
  .footer__brandcol{grid-column:span 2}
}

/* ---------------------------------------------------------------- reduced motion */

@media (prefers-reduced-motion:reduce){
  .ember,.glowdot{display:none !important}
  html.ax-anim [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  *{scroll-behavior:auto !important}
}

/* ---------------------------------------------------------------- chat widget */

.chatfab{
  position:fixed;right:clamp(16px,4vw,32px);bottom:clamp(16px,4vw,32px);z-index:60;
  width:56px;height:56px;border-radius:50%;border:1px solid var(--bd-16);
  background:var(--accent);color:#08090D;cursor:pointer;
  display:grid;place-items:center;font-size:22px;
  box-shadow:0 8px 30px rgba(255,90,54,.35);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),opacity .3s var(--ease);
}
.chatfab:hover{transform:scale(1.07);box-shadow:0 10px 38px rgba(255,90,54,.5)}
.chatfab__icon{position:relative;z-index:1;line-height:1}
.chatfab__pulse{
  position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--accent);
  animation:ax-fabpulse 2.6s ease-out infinite;pointer-events:none;
}
@keyframes ax-fabpulse{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.4)}}
.chatfab.is-open{opacity:0;pointer-events:none;transform:scale(.6)}

.chatpanel{
  position:fixed;right:clamp(16px,4vw,32px);bottom:clamp(16px,4vw,32px);z-index:61;
  width:min(390px,calc(100vw - 32px));height:min(560px,calc(100vh - 64px));
  display:flex;flex-direction:column;
  background:var(--panel);border:1px solid var(--bd-12);border-radius:18px;
  box-shadow:0 24px 70px var(--scrim);overflow:hidden;
  font-family:var(--sans);
  animation:ax-chatin .34s var(--ease) both;
}
.chatpanel[hidden]{display:none}
@keyframes ax-chatin{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}

.chatpanel__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 16px;border-bottom:1px solid var(--bd-08);flex:none;
}
.chatpanel__id{
  display:flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--fg-72);
}
.chatpanel__x{
  background:none;border:none;color:var(--fg-50);cursor:pointer;font-size:15px;
  padding:4px 6px;border-radius:6px;line-height:1;
}
.chatpanel__x:hover{color:var(--fg);background:var(--panel-hover)}

.chatlog{
  flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;
  scrollbar-width:thin;scrollbar-color:var(--bd-16) transparent;
}
.chatlog::-webkit-scrollbar{width:6px}
.chatlog::-webkit-scrollbar-thumb{background:var(--bd-16);border-radius:3px}

.msg{max-width:86%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.55;
  white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.msg--bot{align-self:flex-start;background:var(--panel-hover);color:var(--fg);
  border:1px solid var(--bd-08);border-bottom-left-radius:5px}
.msg--me{align-self:flex-end;background:var(--accent);color:#08090D;
  border-bottom-right-radius:5px}
.msg--err{align-self:flex-start;background:transparent;border:1px dashed var(--bd-25);
  color:var(--fg-60);font-size:13px}
.msg a{color:var(--accent);text-decoration:underline}
.msg--me a{color:#08090D}
.msg ul{margin:6px 0;padding-left:18px}
.msg li{margin:2px 0}
.msg strong{font-weight:600}
.msg code{font-family:var(--mono);font-size:12.5px;background:var(--bd-08);
  padding:1px 5px;border-radius:4px}

.msg--typing{display:flex;gap:5px;align-items:center;padding:14px 15px}
.msg--typing span{width:6px;height:6px;border-radius:50%;background:var(--fg-40);
  animation:ax-typing 1.3s ease-in-out infinite}
.msg--typing span:nth-child(2){animation-delay:.18s}
.msg--typing span:nth-child(3){animation-delay:.36s}
@keyframes ax-typing{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

.chatchips{display:flex;flex-wrap:wrap;gap:7px;padding:0 16px 12px;flex:none}
.chatchips[hidden]{display:none}
.chatchip{
  font-family:var(--sans);font-size:12.5px;color:var(--fg-72);cursor:pointer;
  background:transparent;border:1px solid var(--bd-14);border-radius:999px;
  padding:6px 12px;transition:border-color .2s,color .2s,background .2s;
}
.chatchip:hover{border-color:var(--accent);color:var(--fg);background:var(--panel-hover)}

.chatform{display:flex;gap:8px;padding:12px 16px 8px;border-top:1px solid var(--bd-08);flex:none}
.chatform__input{
  flex:1;min-width:0;background:var(--bg);color:var(--fg);
  border:1px solid var(--bd-14);border-radius:11px;padding:11px 13px;
  font-family:var(--sans);font-size:14px;outline:none;
  transition:border-color .2s;
}
.chatform__input::placeholder{color:var(--fg-40)}
.chatform__input:focus{border-color:var(--accent)}
.chatform__send{
  flex:none;width:42px;border:none;border-radius:11px;cursor:pointer;
  background:var(--accent);color:#08090D;font-size:17px;line-height:1;
  transition:opacity .2s,transform .2s;
}
.chatform__send:hover:not(:disabled){transform:translateX(2px)}
.chatform__send:disabled{opacity:.4;cursor:not-allowed}

.chatpanel__foot{
  flex:none;padding:0 16px 12px;font-size:11px;color:var(--fg-40);
  font-family:var(--mono);letter-spacing:.02em;
}

@media (max-width:520px){
  .chatpanel{right:8px;left:8px;bottom:8px;width:auto;height:min(78vh,560px)}
  .chatfab{right:16px;bottom:16px}
}
@media (prefers-reduced-motion:reduce){
  .chatfab__pulse{display:none}
  .chatpanel{animation:none}
  .msg--typing span{animation:none;opacity:.5}
}
