/* ============ Use-case page (dark) ============ */
.uc { background: var(--kit-ink); color:#fff; }
.uc__wrap { max-width: 1120px; margin:0 auto; padding: 0 clamp(24px,6vw,96px); }

/* hero */
.uc-hero { position:relative; overflow:hidden; padding: clamp(96px,12vh,150px) 0 clamp(40px,6vw,64px); }
.uc-hero__grid { position:absolute; inset:0; z-index:0; background-image:linear-gradient(to right,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.045) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:radial-gradient(ellipse 75% 60% at 30% 20%,#000,transparent 72%); mask-image:radial-gradient(ellipse 75% 60% at 30% 20%,#000,transparent 72%); }
.uc-hero__glow { position:absolute; z-index:0; right:-10%; top:-20%; width:60vw; height:60vw; max-width:820px; max-height:820px; background:radial-gradient(circle at 50% 50%, rgba(91,123,255,.20), rgba(238,77,31,.14) 40%, transparent 66%); filter:blur(20px); pointer-events:none; }
.uc-hero__in { position:relative; z-index:1; max-width: 800px; }
.uc-bc { font-family:var(--font-mono); font-size:12.5px; letter-spacing:.04em; color:var(--kit-slate-500); display:flex; align-items:center; gap:9px; }
.uc-bc a { color:var(--kit-slate-400); text-decoration:none; }
.uc-bc i { width:4px; height:4px; border-radius:50%; background:#3a4150; }
.uc-eyebrow { margin-top:22px; font-family:var(--font-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--kit-fox-300); }
.uc-hero h1 { margin-top:14px; color:#fff; font-family:var(--font-display); font-size:clamp(40px,6vw,74px); line-height:1.03; letter-spacing:-.02em; text-wrap:balance; }
.uc-hero h1 em { font-style:normal; background:var(--kit-gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.uc-lede { margin-top:20px; font-size:clamp(17px,1.6vw,21px); line-height:1.55; color:var(--kit-slate-300); max-width:54ch; }
.uc-cta { margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.uc-tags { margin-top:28px; display:flex; gap:8px; flex-wrap:wrap; }
.uc-tag { font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--kit-slate-300); border:1px solid #232734; border-radius:999px; padding:6px 12px; }

/* section scaffolding + headings */
.uc-sec { padding: clamp(48px,6.5vw,84px) 0; border-top:1px solid #14171f; }
.uc-sec--alt { background:#0c0e15; }
.uc-kick { font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--kit-fox-300); }
.uc-h2 { margin-top:14px; color:#fff; font-family:var(--font-display); font-size:clamp(28px,3.4vw,42px); line-height:1.08; letter-spacing:-.018em; max-width:22ch; text-wrap:balance; }
.uc-sub { margin-top:16px; font-size:clamp(16px,1.45vw,18px); line-height:1.6; color:var(--kit-slate-300); max-width:60ch; }
.uc-p { margin-top:16px; font-size:16px; line-height:1.65; color:var(--kit-slate-400); max-width:62ch; }
.uc-p strong { color:#fff; font-weight:600; }
.uc-p + .uc-p { margin-top:13px; }

/* ============ Governed agentic-flow visual (signature) ============ */
.gflow { position:relative; margin: clamp(26px,3.5vw,40px) 0 0; border:1px solid #1c202b; border-radius:var(--r-xl,22px); background:radial-gradient(120% 130% at 18% 0%, #14182300, #0c0e15) , #0a0c11; box-shadow:0 50px 120px -50px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.04); overflow:hidden; }
.gflow__bar { display:flex; align-items:center; gap:12px; padding:15px 20px; border-bottom:1px solid #161922; font-family:var(--font-mono); font-size:12.5px; color:var(--kit-slate-400); }
.gflow__dots{display:flex;gap:6px;} .gflow__bar i { width:10px;height:10px;border-radius:50%;background:#2a2e38;} .gflow__bar i:first-child{background:var(--kit-fox-500);}
.gflow__title b{ color:#fff; font-weight:500; }
.gflow__live{ margin-left:auto; display:inline-flex; align-items:center; gap:6px; color:var(--kit-fox-300); text-transform:uppercase; letter-spacing:.08em; font-size:10.5px; }
.gflow__live span{ width:7px;height:7px;border-radius:50%;background:var(--kit-fox-500); animation:gpls 2s infinite; }
@keyframes gpls{0%{box-shadow:0 0 0 0 rgba(238,77,31,.5);}70%,100%{box-shadow:0 0 0 7px rgba(238,77,31,0);}}
.gflow__track { position:relative; display:grid; grid-template-columns:repeat(6,1fr); gap:0; padding:38px 26px 30px; }
.gflow__lane { position:absolute; left:calc(26px + 8.33%); right:calc(26px + 8.33%); top:96px; height:2px; background:linear-gradient(90deg,#232a3d,#2a2030); border-radius:2px; }
.gflow__pulse { position:absolute; top:-3px; width:8px; height:8px; border-radius:50%; background:var(--kit-fox-500); box-shadow:0 0 14px 3px rgba(238,77,31,.6); animation:grun 7s linear infinite; }
@keyframes grun{0%{left:0%;opacity:0;}5%{opacity:1;}40%{left:46%;}54%{left:46%;}92%{left:100%;opacity:1;}100%{left:100%;opacity:0;}}
.gnode { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 8px; }
.gnode__ico { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; background:#11141c; border:1px solid #232734; color:var(--kit-slate-300); position:relative; z-index:1; }
.gnode__ico svg{ width:20px; height:20px; }
.gnode--agent .gnode__ico{ border-color:rgba(91,123,255,.35); background:linear-gradient(150deg,rgba(91,123,255,.16),rgba(91,123,255,.03)); color:#9db0ff; }
.gnode--gate .gnode__ico{ border-color:rgba(238,77,31,.5); background:linear-gradient(150deg,rgba(238,77,31,.18),rgba(238,77,31,.03)); color:var(--kit-fox-300); box-shadow:0 0 24px -4px rgba(238,77,31,.45); }
.gnode__k { margin-top:12px; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; color:var(--kit-slate-500); }
.gnode__t { margin-top:4px; font-size:14px; font-weight:600; line-height:1.2; }
.gnode__s { margin-top:4px; font-family:var(--font-mono); font-size:11px; color:var(--kit-slate-500); line-height:1.35; }
.gnode__tag { margin-top:9px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:999px; }
.gnode--agent .gnode__tag{ color:#9db0ff; background:rgba(91,123,255,.1); border:1px solid rgba(91,123,255,.25); }
.gnode--gate .gnode__tag{ color:var(--kit-fox-300); background:rgba(238,77,31,.1); border:1px solid rgba(238,77,31,.3); }
.gflow__legend { display:flex; gap:20px; flex-wrap:wrap; padding:0 26px 22px; font-family:var(--font-mono); font-size:11px; color:var(--kit-slate-400); }
.gflow__legend i{ display:inline-block; width:9px;height:9px;border-radius:3px; margin-right:7px; vertical-align:middle; }
.lg-agent i{ background:#5b7bff; } .lg-gate i{ background:var(--kit-fox-500); }
@media (max-width:820px){ .gflow__track{ grid-template-columns:1fr; gap:10px; padding:24px 22px; } .gnode{ flex-direction:row; gap:14px; text-align:left; align-items:flex-start; } .gnode__t,.gnode__s,.gnode__k{ margin-top:0; } .gnode__meta{ display:flex; flex-direction:column; gap:3px; } .gflow__lane{ display:none; } }

/* capabilities grid (what it actually runs) */
.uc-caps { margin-top:34px; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.uc-cap { border:1px solid #1c202b; border-radius:14px; background:#11141c; padding:20px; }
.uc-cap__n { font-family:var(--font-mono); font-size:11px; color:var(--kit-fox-300); letter-spacing:.08em; }
.uc-cap h3 { margin-top:11px; font-size:15.5px; font-weight:600; line-height:1.25; }
.uc-cap p { margin-top:7px; font-size:13.5px; line-height:1.5; color:var(--kit-slate-400); }
@media (max-width:980px){ .uc-caps{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:540px){ .uc-caps{ grid-template-columns:1fr; } }

/* governed-by-design points */
.uc-gov { margin-top:30px; display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.uc-govpt { display:flex; gap:14px; border:1px solid #1c202b; border-radius:14px; background:rgba(255,255,255,.015); padding:20px; }
.uc-govpt__i { flex:none; width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:rgba(238,77,31,.1); border:1px solid rgba(238,77,31,.28); color:var(--kit-fox-300); }
.uc-govpt__i svg{ width:18px; height:18px; }
.uc-govpt h3 { font-size:15.5px; font-weight:600; }
.uc-govpt p { margin-top:6px; font-size:13.5px; line-height:1.55; color:var(--kit-slate-400); }
@media (max-width:720px){ .uc-gov{ grid-template-columns:1fr; } }

/* stats */
.uc-stats { margin-top:30px; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.uc-stat { border-left:2px solid var(--kit-fox-500); padding-left:18px; }
.uc-stat b{ font-family:var(--font-display); font-size:clamp(30px,4vw,44px); line-height:1; letter-spacing:-.02em; display:block; }
.uc-stat span{ display:block; margin-top:8px; font-family:var(--font-mono); font-size:11.5px; color:var(--kit-slate-400); line-height:1.4; }
@media (max-width:760px){ .uc-stats{ grid-template-columns:repeat(2,1fr); gap:24px 16px; } }

/* FAQ */
.uc-faq { margin-top:28px; max-width:820px; }
.uc-faq details { border-top:1px solid #1c202b; padding:18px 0; }
.uc-faq details:last-child{ border-bottom:1px solid #1c202b; }
.uc-faq summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:20px; font-size:17px; font-weight:600; color:#fff; }
.uc-faq summary::-webkit-details-marker{ display:none; }
.uc-faq summary::after{ content:"+"; color:var(--kit-fox-300); font-family:var(--font-mono); font-size:20px; line-height:1; }
.uc-faq details[open] summary::after{ content:"–"; }
.uc-faq p { margin-top:12px; font-size:15px; line-height:1.6; color:var(--kit-slate-300); max-width:64ch; }

/* related */
.uc-rel { margin-top:30px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.uc-relcard { border:1px solid #1c202b; border-radius:14px; background:#11141c; padding:20px; text-decoration:none; color:#fff; transition:border-color .25s, transform .25s; display:block; }
.uc-relcard:hover{ border-color:var(--kit-fox-700,#9c3318); transform:translateY(-2px); }
.uc-relcard span{ font-family:var(--font-mono); font-size:11px; color:var(--kit-slate-500); letter-spacing:.06em; text-transform:uppercase; }
.uc-relcard b{ display:block; margin-top:9px; font-size:16px; }
.uc-relcard em{ font-style:normal; color:var(--kit-fox-300); font-family:var(--font-mono); font-size:13px; }
@media (max-width:760px){ .uc-rel{ grid-template-columns:1fr; } }

/* CTA band */
.uc-band { text-align:center; padding: clamp(60px,8vw,100px) 0; }
.uc-band h2 { color:#fff; font-family:var(--font-display); font-size:clamp(30px,4.4vw,56px); line-height:1.05; letter-spacing:-.02em; text-wrap:balance; }
.uc-band p{ margin:16px auto 0; max-width:48ch; color:var(--kit-slate-300); font-size:17px; }
.uc-band .uc-cta{ justify-content:center; }
