/* ROOX web sitesi — ROOX kurumsal kimliği (marka/) üzerine.
   Koyu tek tema: marka önce koyu temada tasarlanır. */
:root{
  --bg:#14181E; --bg-deep:#101318; --surface:#1A1F26; --raised:#232A33;
  --line:#2E3744; --line-strong:#66758E;
  --ink:#E8EEF6; --muted:#9AA7B8; --faint:#6F7C8F;
  --primary:#1F66E0; --primary-hover:#2F78F0; --on-primary:#FFFFFF; --navy:#082B78;
  --signal:#3FCBF5; --signal-ink:#7FD6FF; --signal-soft:rgba(63,203,245,.14);
  --oak:#D2A06A; --success:#3CCB8E; --warning:#F2B544; --danger:#FF7A6E; --focus:#7FD6FF;
  --f-display:"Unbounded","Manrope",system-ui,sans-serif;
  --f-body:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s6:24px;--s8:32px;--s12:48px;--s16:64px;
  --r-sm:8px;--r-md:14px;--r-lg:22px;--r-pill:999px;
  --shadow-lift:0 16px 40px rgba(0,0,0,.45);
  --shadow-glow:0 0 0 1px rgba(63,203,245,.25),0 8px 28px rgba(31,102,224,.3);
  --wrap:1200px;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:auto}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
h1,h2,h3,h4{margin:0;text-wrap:balance}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.label{font:500 11px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--signal-ink);display:inline-flex;align-items:center;gap:8px}
.label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px var(--signal-soft)}
.h-display{font-family:var(--f-display);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.sec{padding-block:clamp(72px,9vw,128px)}
.sec.deep{background:var(--bg-deep)}
.sec-head{display:flex;flex-direction:column;gap:var(--s4);max-width:760px;margin-bottom:clamp(36px,5vw,56px)}
.sec-head h2{font-family:var(--f-display);font-weight:600;font-size:clamp(28px,3.6vw,46px);line-height:1.08;letter-spacing:-.035em}
.sec-head p{color:var(--muted);font-size:clamp(16px,1.4vw,18px);max-width:62ch}
.sec-head.center{margin-inline:auto;text-align:center;align-items:center}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 24px;border-radius:var(--r-md);font:700 15px/1 var(--f-body);text-decoration:none;border:1px solid transparent;transition:background .2s,border-color .2s,transform .2s;white-space:nowrap}
.btn svg{width:18px;height:18px}
.btn-p{background:var(--primary);color:var(--on-primary)}
.btn-p:hover{background:var(--primary-hover);transform:translateY(-1px)}
.btn-s{background:var(--surface);color:var(--ink);border-color:var(--line-strong)}
.btn-s:hover{border-color:var(--ink)}
.btn-sm{height:40px;padding:0 16px;font-size:14px;border-radius:var(--r-sm)}

/* header */
.hdr{position:fixed;inset:0 0 auto 0;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.hdr.solid{background:rgba(16,19,24,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line)}
.hdr-in{display:flex;align-items:center;gap:var(--s8);height:76px}
.logo{display:flex;align-items:center;text-decoration:none}
.logo img{height:34px;width:auto}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{text-decoration:none;color:var(--muted);font-weight:600;font-size:14.5px;padding:8px 12px;border-radius:var(--r-sm);transition:color .2s,background .2s}
.nav a:hover{color:var(--ink);background:var(--surface)}
.hdr-cta{display:flex;gap:var(--s2)}
.burger{display:none;margin-left:auto;width:44px;height:44px;border-radius:var(--r-sm);border:1px solid var(--line-strong);background:var(--surface);place-items:center}
.burger svg{width:20px;height:20px}
.mnav{position:fixed;inset:0;z-index:49;background:var(--bg-deep);padding:100px max(20px,env(safe-area-inset-right,0px)) 40px max(20px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:6px}
.mnav a{font:600 24px/1.3 var(--f-display);letter-spacing:-.02em;text-decoration:none;padding:12px 0;border-bottom:1px solid var(--line)}

/* hero */
.hero{position:relative;padding-top:clamp(130px,16vw,180px);padding-bottom:clamp(60px,8vw,110px);overflow:hidden}
.hero::before{content:"";position:absolute;inset:-20% -10% auto auto;width:70vw;height:70vw;max-width:900px;max-height:900px;background:radial-gradient(closest-side,rgba(31,102,224,.22),transparent 70%);pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero h1{font-family:var(--f-display);font-weight:600;font-size:clamp(38px,6vw,76px);line-height:1.02;letter-spacing:-.045em;margin-top:var(--s6)}
.hero h1 .hl{color:var(--primary-hover)}
.hero .lead{font-size:clamp(17px,1.6vw,20px);color:var(--muted);margin-top:var(--s6);max-width:54ch;line-height:1.6}
.typed{color:var(--ink);font-weight:700;border-bottom:2px solid var(--signal);padding-bottom:1px;white-space:nowrap}
.hero-cta{display:flex;gap:var(--s3);flex-wrap:wrap;margin-top:var(--s8)}
.hero-note{display:flex;gap:var(--s6);flex-wrap:wrap;margin-top:var(--s8);font-size:14px;color:var(--muted)}
.hero-note span{display:inline-flex;align-items:center;gap:8px}
.hero-note svg{width:16px;height:16px;color:var(--success)}

/* robot stage */
.robot-stage{position:relative;aspect-ratio:1/1;max-width:560px;width:100%;margin-inline:auto}
.robot-stage .ring{position:absolute;inset:8%;border:1px dashed var(--line);border-radius:50%}
.robot-stage .ring.r2{inset:22%;border-style:solid;border-color:rgba(63,203,245,.18)}
.robot{position:absolute;left:50%;top:50%;width:46%;transform:translate(-50%,-50%)}
.robot svg{width:100%;height:auto;overflow:visible}
.robot .eyes{transform-origin:50% 300px;animation:blink 5s infinite}
.robot .ant{transform-origin:256px 196px;animation:bob 3.2s ease-in-out infinite}
@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.12)}}
@keyframes bob{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(5deg)}}
.orbit{position:absolute;inset:0;animation:orbit 60s linear infinite}
.orbit .ag{position:absolute;left:50%;top:50%;width:0;height:0}
.orbit .chip{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;padding:8px 12px 8px 8px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);white-space:nowrap;font-size:13px;font-weight:700;box-shadow:var(--shadow-lift);animation:counter 60s linear infinite}
.chip .av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 18%,transparent)}
.chip .av svg{width:15px;height:15px}
.chip i{width:7px;height:7px;border-radius:50%;background:var(--signal);animation:pulse 1.6s infinite}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes counter{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes pulse{50%{opacity:.3}}

/* marquee */
.marq{border-block:1px solid var(--line);background:var(--bg-deep);overflow:hidden;padding-block:22px}
.marq-row{display:flex;gap:56px;width:max-content;animation:marq 38s linear infinite}
.marq-row span{font:600 18px/1 var(--f-display);letter-spacing:-.02em;color:var(--faint);white-space:nowrap;display:inline-flex;align-items:center;gap:14px}
.marq-row span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--line-strong);margin-left:42px}
@keyframes marq{to{transform:translateX(-50%)}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.stat{padding:clamp(20px,3vw,36px)}
.stat+.stat{border-left:1px solid var(--line)}
.stat b{display:block;font:500 clamp(34px,4.4vw,56px)/1 var(--f-mono);letter-spacing:-.04em;color:var(--ink)}
.stat b small{font-size:.5em;color:var(--signal-ink);margin-left:2px}
.stat span{display:block;margin-top:var(--s3);color:var(--muted);font-size:14.5px;max-width:24ch}

/* agents */
.agents{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s6)}
.agent{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s4);transition:border-color .25s,transform .25s}
.agent:hover{border-color:var(--line-strong);transform:translateY(-4px)}
.agent .av{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:var(--c);background:color-mix(in srgb,var(--c) 16%,transparent);position:relative}
.agent .av::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--signal);border-top-color:transparent;animation:orbit 6s linear infinite}
.agent .av svg{width:24px;height:24px}
.agent h3{font-size:18px;font-weight:700;line-height:1.3}
.agent h3 small{display:block;font-size:13px;font-weight:500;color:var(--muted);margin-top:2px}
.agent p{color:var(--muted);font-size:14.5px;line-height:1.55}
.agent .bub{background:var(--raised);border:1px solid var(--line);border-radius:14px 14px 14px 4px;padding:10px 12px;font-size:13px;line-height:1.45;color:var(--ink);margin-top:auto}
.agent.chat{border-color:var(--primary);box-shadow:var(--shadow-glow)}
.agent.watch{background:var(--navy);border-color:var(--navy)}
.agent.watch p,.agent.watch h3 small{color:#C8D6F0}
.agent.watch .av{--c:#7FD6FF;background:rgba(255,255,255,.08)}
.agent .tag{position:absolute;top:var(--s6);right:var(--s6);font:500 10.5px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--signal-ink)}

/* steps */
.steps-wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:start}
.steps-side{position:sticky;top:120px}
.steps-side .bar{height:4px;border-radius:2px;background:var(--line);margin-top:var(--s8);overflow:hidden;max-width:360px}
.steps-side .bar i{display:block;height:100%;width:0;background:var(--signal)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s6)}
.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,3vw,36px);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s6);opacity:.45;transition:opacity .4s,border-color .4s}
.step.on{opacity:1;border-color:var(--line-strong)}
.step .n{font:600 15px/1 var(--f-mono);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--line-strong);color:var(--muted)}
.step.on .n{border-color:var(--signal);color:var(--signal-ink);box-shadow:0 0 0 6px var(--signal-soft)}
.step h3{font-family:var(--f-display);font-weight:600;font-size:clamp(20px,2vw,24px);letter-spacing:-.025em;line-height:1.2}
.step p{color:var(--muted);margin-top:var(--s3);font-size:15.5px}
.step .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:var(--s4)}
.step .chips span{font:500 12px/1 var(--f-mono);padding:7px 10px;border-radius:var(--r-pill);background:var(--raised);border:1px solid var(--line);color:var(--ink)}

/* showcase */
.tabs{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);margin-bottom:var(--s8);flex-wrap:wrap}
.tabs button{border:0;background:none;color:var(--muted);font-weight:700;font-size:14.5px;padding:10px 18px;border-radius:var(--r-pill);transition:background .2s,color .2s}
.tabs button[aria-selected="true"]{background:var(--primary);color:var(--on-primary)}
.show{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.frame{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--bg-deep);box-shadow:var(--shadow-lift)}
.frame .bar{display:flex;gap:6px;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--surface)}
.frame .bar i{width:10px;height:10px;border-radius:50%;background:var(--line-strong)}
.frame img{width:100%;height:auto}
.phones{display:flex;gap:var(--s4);justify-content:center}
.phone{width:min(46%,240px);border-radius:32px;border:6px solid #262d38;background:#0b0e12;overflow:hidden;box-shadow:var(--shadow-lift);aspect-ratio:600/1240}
.phone img{width:100%;height:100%;object-fit:cover;object-position:top}
.phone:nth-child(2){transform:translateY(40px)}
.show-copy h3{font-family:var(--f-display);font-weight:600;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.03em;line-height:1.15}
.show-copy p{color:var(--muted);margin-top:var(--s4)}
.ticks{list-style:none;padding:0;margin:var(--s6) 0 0;display:flex;flex-direction:column;gap:var(--s3)}
.ticks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:15px}
.ticks svg{width:20px;height:20px;color:var(--signal);margin-top:2px}

/* auditor */
.audit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;position:relative}
.tl li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:var(--s4);padding-bottom:var(--s6);position:relative}
.tl li::before{content:"";position:absolute;left:15px;top:30px;bottom:0;width:2px;background:var(--line)}
.tl li:last-child::before{display:none}
.tl .dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1.5px solid var(--line-strong);font:600 12px var(--f-mono);color:var(--muted);transition:all .4s}
.tl li.on .dot{border-color:var(--c,var(--signal));color:var(--c,var(--signal-ink));box-shadow:0 0 0 5px color-mix(in srgb,var(--c,var(--signal)) 18%,transparent)}
.tl b{display:block;font-size:15.5px}
.tl span{display:block;color:var(--muted);font-size:14.5px;margin-top:2px}
.tl li.err{--c:var(--danger)}.tl li.ok{--c:var(--success)}

/* factory schematic */
.fab{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-deep);padding:clamp(16px,2.5vw,28px)}
.fab svg{width:100%;height:auto;display:block}
.fab text{font-family:var(--f-mono);font-size:2.3px;fill:var(--ink)}
.fab .sub{fill:var(--muted)}

/* pricing */
.bill{display:inline-flex;align-items:center;gap:var(--s3);margin-bottom:var(--s8);font-weight:700;font-size:14.5px;color:var(--muted)}
.switch{width:52px;height:30px;border-radius:var(--r-pill);background:var(--raised);border:1px solid var(--line-strong);position:relative;padding:0}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--ink);transition:transform .25s}
.switch[aria-checked="true"]{background:var(--primary);border-color:var(--primary)}
.switch[aria-checked="true"]::after{transform:translateX(22px)}
.save{font:500 11px var(--f-mono);letter-spacing:.08em;color:var(--success);background:rgba(60,203,142,.12);padding:5px 8px;border-radius:var(--r-pill)}
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);align-items:stretch}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:var(--s4)}
.plan.best{border-color:var(--primary);box-shadow:var(--shadow-glow);position:relative}
.plan.best::before{content:"En çok seçilen";position:absolute;top:-13px;left:var(--s6);font:600 11px/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;background:var(--primary);color:var(--on-primary);padding:7px 10px;border-radius:var(--r-pill)}
.plan h3{font-size:20px;font-weight:800}
.plan .desc{color:var(--muted);font-size:14.5px;min-height:44px}
.price{display:flex;align-items:baseline;gap:6px}
.price b{font:500 clamp(36px,3.6vw,46px)/1 var(--f-mono);letter-spacing:-.04em}
.price span{color:var(--muted);font-size:14px}
.plan ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:14.5px;flex:1}
.plan li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px}
.plan li svg{width:18px;height:18px;color:var(--signal);margin-top:3px}
.plan .btn{width:100%}

/* faq */
.faq{display:flex;flex-direction:column;gap:var(--s3);max-width:860px;margin-inline:auto}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color .2s}
.faq details[open]{border-color:var(--line-strong)}
.faq summary{list-style:none;cursor:pointer;padding:20px 24px;display:flex;justify-content:space-between;gap:var(--s4);font-weight:700;font-size:16.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--f-mono);color:var(--signal-ink);transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 24px 22px;color:var(--muted);max-width:70ch}

/* contact */
.cta-band{background:var(--navy);border-radius:var(--r-lg);padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);position:relative;overflow:hidden}
.cta-band::after{content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;border:40px solid rgba(63,203,245,.12);pointer-events:none}
.cta-band h2{font-family:var(--f-display);font-weight:600;font-size:clamp(28px,3.4vw,44px);line-height:1.08;letter-spacing:-.035em}
.cta-band p{color:#C8D6F0;margin-top:var(--s4);max-width:46ch}
.cta-band .ticks li{color:#E8EEF6}
form.lead{position:relative;z-index:1;background:var(--bg);border-radius:var(--r-lg);padding:clamp(20px,3vw,32px);display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.field.full{grid-column:1/-1}
.field input,.field select,.field textarea{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-md);padding:13px 14px;font-size:15px;color:var(--ink);min-width:0;width:100%}
.field textarea{min-height:96px;resize:vertical}
.form-msg{grid-column:1/-1;font-size:14px;min-height:20px}
.form-msg.ok{color:var(--success)}.form-msg.err{color:var(--danger)}

/* footer */
.ftr{border-top:1px solid var(--line);padding-block:56px calc(40px + env(safe-area-inset-bottom,0px));background:var(--bg-deep)}
.ftr-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:var(--s8)}
.ftr h4{font:500 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s4)}
.ftr ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.ftr a{text-decoration:none;color:var(--ink);font-size:14.5px}
.ftr a:hover{color:var(--signal-ink)}
.ftr-bottom{display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;margin-top:var(--s12);padding-top:var(--s6);border-top:1px solid var(--line);font-size:13px;color:var(--faint)}

/* chat bot */
.bot-btn{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;width:68px;height:68px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);box-shadow:var(--shadow-lift);display:grid;place-items:center;padding:10px;transition:transform .25s}
.bot-btn:hover{transform:scale(1.06)}
.bot-btn svg{width:100%;height:auto}
.bot-btn .ping{position:absolute;top:4px;right:4px;width:14px;height:14px;border-radius:50%;background:var(--signal);border:2px solid var(--surface);animation:pulse 1.6s infinite}
.bot-hint{position:fixed;right:calc(max(20px,env(safe-area-inset-right,0px)) + 80px);bottom:calc(36px + env(safe-area-inset-bottom,0px));z-index:60;background:var(--surface);border:1px solid var(--line);border-radius:14px 14px 4px 14px;padding:10px 14px;font-size:14px;box-shadow:var(--shadow-lift);max-width:240px}
.bot{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(100px + env(safe-area-inset-bottom,0px));z-index:61;width:min(400px,calc(100vw - 40px));height:min(600px,calc(100vh - 140px));background:var(--bg-deep);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--shadow-lift);display:flex;flex-direction:column;overflow:hidden;transform-origin:bottom right;transition:transform .25s,opacity .25s}
.bot.closed{transform:scale(.9) translateY(20px);opacity:0;pointer-events:none}
.bot-h{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--surface)}
.bot-h .mk{width:40px;height:40px;border-radius:12px;background:var(--bg);display:grid;place-items:center;padding:6px}
.bot-h b{display:block;font-size:15px}
.bot-h small{font-size:12.5px;color:var(--success);display:flex;align-items:center;gap:6px}
.bot-h small::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.bot-x{margin-left:auto;width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--bg);display:grid;place-items:center}
.bot-x svg{width:16px;height:16px}
.bot-log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:86%;padding:10px 14px;border-radius:16px;font-size:14.5px;line-height:1.5;word-wrap:break-word}
.msg.me{align-self:flex-end;background:var(--primary);color:var(--on-primary);border-bottom-right-radius:4px}
.msg.ai{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.ai p+p{margin-top:6px}.msg.ai ul{margin:4px 0;padding-left:18px}
.dots{display:inline-flex;gap:4px}.dots i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:pulse 1.2s infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
.bot-sugg{display:flex;gap:6px;overflow-x:auto;padding:0 16px 10px}
.bot-sugg button{border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--r-pill);padding:8px 12px;font-size:13px;white-space:nowrap;font-weight:600}
.bot-f{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.bot-f input{flex:1;min-width:0;border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--r-md);padding:12px 14px;font-size:15px}
.bot-f button{width:48px;border-radius:var(--r-md);border:0;background:var(--primary);color:var(--on-primary);display:grid;place-items:center}
.bot-f button svg{width:18px;height:18px}
.bot-src{font:500 10px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--faint);display:block;margin-top:6px}

/* reveal: visible at rest; JS adds motion only */
.rv{will-change:transform}

/* responsive */
@media (max-width:1060px){
  .agents{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav{display:none}
  .burger{display:grid}
  .hdr-cta .btn-s{display:none}
}
@media (max-width:900px){
  .hero-grid,.steps-wrap,.show,.audit,.cta-band{grid-template-columns:minmax(0,1fr)}
  .steps-side{position:static}
  .plans{grid-template-columns:minmax(0,1fr);max-width:520px;margin-inline:auto}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat:nth-child(3){border-left:0}
  .stat:nth-child(n+3){border-top:1px solid var(--line)}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .robot-stage{max-width:440px}
}
@media (max-width:600px){
  .agents{grid-template-columns:minmax(0,1fr)}
  form.lead{grid-template-columns:minmax(0,1fr)}
  .hdr-cta{display:none}
  .orbit{inset:12%}
  .orbit .chip{font-size:11.5px;padding:6px 10px 6px 6px}
  .chip .av{width:22px;height:22px}
  .bot-hint{display:none}
  .step{grid-template-columns:minmax(0,1fr)}
  .phone:nth-child(2){transform:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
