/* =====================================================================
   INDUSTRIES · hero with rotating word + expanding industry doors
   ===================================================================== */
.i-hero{position:relative;padding:calc(var(--nav-h) + 60px) 24px 30px;
  background:radial-gradient(50% 50% at 50% 0%,rgba(124,58,237,.16),transparent 70%),var(--bg)}
.i-hero-top{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
.rot-title{margin:18px 0 0;font-family:var(--f-d);font-weight:600;font-size:clamp(34px,5.2vw,78px);letter-spacing:-.05em;line-height:1.04}
.rot{display:inline-block;min-width:6ch;background:linear-gradient(90deg,var(--glow),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.1em}
.rot .c{display:inline-block}
.rot .c.s{color:var(--glow);-webkit-text-fill-color:var(--glow);opacity:.6}
.i-hero .lead{margin-top:0;max-width:36ch;font-size:16.5px}
.doors{display:flex;gap:12px;height:clamp(380px,48vh,480px);margin-top:44px}
.door{position:relative;flex:1;min-width:0;overflow:hidden;border-radius:24px;border:1px solid rgba(205,166,255,.2);cursor:pointer;
  transition:flex .7s cubic-bezier(.2,.8,.2,1),border-color .4s ease;background:#07030D}
.door.on{flex:2.6;border-color:rgba(205,166,255,.45)}
.door img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42;transform:scale(1.08);transition:opacity .7s ease,transform 1.2s ease}
.door.on img{opacity:.75;transform:scale(1)}
.door::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,2,8,.15) 30%,rgba(5,2,8,.92))}
.door-in{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:space-between;padding:22px 22px 24px}
.door-k{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-m);font-size:12px;letter-spacing:.16em;color:var(--glow)}
.door-k .ar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(205,166,255,.3);color:var(--ink);
  transition:transform .4s ease,background .4s ease,border-color .4s ease}
.door-k .ar svg{width:14px;height:14px}
.door.on .door-k .ar{transform:rotate(-45deg);background:linear-gradient(135deg,var(--violet),var(--purple));border-color:transparent}
.door h2{margin:0;font-family:var(--f-d);font-weight:600;font-size:clamp(20px,2vw,30px);letter-spacing:-.035em;line-height:1.1}
.door .more{max-height:0;opacity:0;overflow:hidden;transition:max-height .7s ease,opacity .5s ease}
.door.on .more{max-height:200px;opacity:1;transition-delay:.15s}
.door .more p{margin:10px 0 0;max-width:42ch;color:var(--ink);opacity:.85;font-size:15px;line-height:1.55}
.door .flowline{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.door .flowline span{font-size:12px;padding:4px 9px;border-radius:999px;background:rgba(18,8,31,.75);border:1px solid rgba(205,166,255,.22);color:var(--muted);white-space:nowrap}

/* sticky industry switcher */
.i-switch{position:sticky;top:calc(var(--nav-h) + 1px);z-index:40;display:flex;justify-content:center;padding:12px 16px;pointer-events:none}
.i-switch nav{pointer-events:auto;display:flex;gap:4px;padding:5px;border-radius:999px;background:rgba(14,6,24,.82);border:1px solid rgba(205,166,255,.2);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 10px 30px -12px rgba(0,0,0,.8);max-width:100%;overflow-x:auto;scrollbar-width:none}
.i-switch nav::-webkit-scrollbar{display:none}
.i-switch a{position:relative;padding:8px 15px;border-radius:999px;font-size:13.5px;color:var(--muted);white-space:nowrap;transition:color .25s ease}
.i-switch a:hover{color:var(--ink)}
.i-switch a.on{color:#fff}
.i-switch .pill{position:absolute;top:5px;left:0;height:calc(100% - 10px);border-radius:999px;background:linear-gradient(135deg,var(--violet),var(--purple));
  box-shadow:0 6px 18px -6px rgba(168,85,247,.8);transition:transform .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1);z-index:-1}
.i-switch nav{position:relative;isolation:isolate}

/* =====================================================================
   INDUSTRIES · one section per industry
   ===================================================================== */
.ind{position:relative;padding:72px 24px 64px;scroll-margin-top:calc(var(--nav-h) + 60px)}
.ind + .ind{border-top:1px solid var(--line)}
.ind-top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.ind-num{font-family:var(--f-d);font-weight:600;font-size:clamp(80px,10vw,150px);letter-spacing:-.07em;line-height:.8;color:transparent;-webkit-text-stroke:1.2px rgba(205,166,255,.3)}
.ind h2{margin:14px 0 0;font-family:var(--f-d);font-weight:600;font-size:clamp(30px,3.8vw,54px);letter-spacing:-.045em;line-height:1.04}
.ind .tagl{margin:12px 0 0;font-size:clamp(17px,1.4vw,20px);line-height:1.45;color:var(--glow)}
.ind .desc{margin:14px 0 0;color:var(--muted);font-size:16px;line-height:1.65;max-width:52ch}
.ind .wf{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.ind .wf span{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 11px;border-radius:999px;font-size:13.5px;color:var(--ink);
  background:rgba(14,6,24,.85);border:1px solid rgba(205,166,255,.26)}
.ind .wf span::before{content:"";width:6px;height:6px;border-radius:50%;background:#4ADE80;box-shadow:0 0 8px #4ADE80}
.ind-photo{position:relative;aspect-ratio:16/11;border-radius:24px;overflow:hidden;border:1px solid rgba(205,166,255,.2)}
.ind-photo img{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover;will-change:transform}
.ind-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,2,8,0) 40%,rgba(5,2,8,.85))}
.case-chip{position:absolute;left:16px;right:16px;bottom:16px;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;
  background:rgba(14,6,24,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(205,166,255,.28);transition:border-color .25s ease,transform .25s ease}
.case-chip:hover{border-color:var(--glow);transform:translateY(-2px)}
.case-chip .live{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;background:rgba(74,222,128,.12);
  font-family:var(--f-m);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#4ADE80}
.case-chip .live::before{content:"";width:6px;height:6px;border-radius:50%;background:#4ADE80;box-shadow:0 0 8px #4ADE80;animation:pulse 1.6s infinite}
.case-chip b{display:block;font-weight:500;font-size:14.5px;color:var(--ink)}
.case-chip small{display:block;font-size:12.5px;color:var(--muted)}
.case-chip .go{margin-left:auto;color:var(--glow)}
.case-chip .go svg{width:16px;height:16px}

/* the journey: 5 steps that light up as you scroll */
.journey{position:relative;margin-top:56px}
.j-label{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;font-family:var(--f-m);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.j-label b{font-weight:500;color:var(--glow)}
.j-track{position:relative;height:2px;margin:0 10%;border-radius:2px;background:rgba(205,166,255,.14)}
.j-fill{position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:2px;transform-origin:left;transform:scaleX(var(--p,0));
  background:linear-gradient(90deg,var(--violet),var(--pink),#4ADE80);box-shadow:0 0 12px rgba(232,121,249,.6)}
.j-dot{position:absolute;top:50%;left:calc(var(--p,0) * 100%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 4px rgba(232,121,249,.3),0 0 18px #E879F9}
.j-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:-1px}
.j-step{position:relative;padding-top:30px;text-align:center}
.j-step .node{position:absolute;top:-12px;left:50%;width:24px;height:24px;margin-left:-12px;border-radius:50%;display:grid;place-items:center;
  background:#0C0516;border:1.5px solid rgba(205,166,255,.3);font-family:var(--f-m);font-size:10.5px;color:var(--dim);transition:all .4s ease}
.j-card{height:100%;padding:16px 14px 18px;border-radius:16px;border:1px solid rgba(205,166,255,.1);background:rgba(14,6,24,.5);
  opacity:.45;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease,border-color .5s ease,background .5s ease}
.j-card h3{margin:0 0 6px;font-family:var(--f-d);font-weight:500;font-size:15.5px;letter-spacing:-.02em}
.j-card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.5}
.j-step.on .node{background:linear-gradient(135deg,var(--violet),var(--pink));border-color:transparent;color:#fff;box-shadow:0 0 16px rgba(232,121,249,.7)}
.j-step.on .j-card{opacity:1;transform:none;border-color:rgba(205,166,255,.28);background:linear-gradient(180deg,rgba(124,58,237,.14),rgba(14,6,24,.6))}

/* agent on duty */
.agent-row{display:flex;align-items:center;gap:16px;margin-top:22px;padding:14px 16px;border-radius:18px;border:1px solid rgba(205,166,255,.16);background:rgba(14,6,24,.6)}
.ag-ava{flex-shrink:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--violet),var(--purple));
  font-family:var(--f-d);font-weight:600;font-size:15px;letter-spacing:-.05em;color:#fff;box-shadow:0 0 22px -4px rgba(168,85,247,.8)}
.agent-row b{display:block;font-weight:500;font-size:14.5px;color:var(--ink)}
.agent-row small{display:block;font-size:13.5px;color:var(--muted)}
.ag-msg{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:12px;background:rgba(124,58,237,.14);
  font-family:var(--f-m);font-size:11.5px;letter-spacing:.04em;color:var(--glow);white-space:nowrap}
.ag-msg::before{content:"";width:6px;height:6px;border-radius:50%;background:#4ADE80;box-shadow:0 0 8px #4ADE80;animation:pulse 1.6s infinite}

/* =====================================================================
   INDUSTRIES · "your industry?" — type it in
   ===================================================================== */
.yours{padding:40px 24px 100px;scroll-margin-top:calc(var(--nav-h) + 60px)}
.yours-in{position:relative;overflow:hidden;padding:48px;border-radius:28px;border:1.5px dashed rgba(205,166,255,.35);
  background:radial-gradient(60% 90% at 85% 20%,rgba(168,85,247,.22),transparent 70%),linear-gradient(160deg,#120821,#07030D)}
.yours h2{margin:14px 0 0;font-family:var(--f-d);font-weight:600;font-size:clamp(28px,3.4vw,48px);letter-spacing:-.045em;line-height:1.06}
.yours h2 em{font-style:normal;background:linear-gradient(90deg,var(--glow),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.1em}
.yours p.l{margin:14px 0 0;color:var(--muted);font-size:16px;line-height:1.6;max-width:52ch}
.ask{display:flex;align-items:center;gap:10px;margin-top:28px;max-width:560px;padding:6px 6px 6px 18px;border-radius:999px;background:rgba(5,2,8,.7);
  border:1px solid rgba(205,166,255,.3);transition:border-color .2s ease,box-shadow .2s ease}
.ask:focus-within{border-color:var(--glow);box-shadow:0 0 0 4px rgba(205,166,255,.12)}
.ask label{font-family:var(--f-m);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.ask input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--ink);font:500 16px var(--f-b);padding:10px 0}
.ask input::placeholder{color:var(--dim)}
.y-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:30px}
.y-step{position:relative;padding:18px 16px;border-radius:16px;border:1px solid rgba(205,166,255,.2);background:rgba(14,6,24,.65)}
.y-step:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50%;width:12px;height:1px;background:linear-gradient(90deg,var(--purple),var(--pink))}
.y-step i{font-style:normal;font-family:var(--f-m);font-size:11px;letter-spacing:.14em;color:var(--pink)}
.y-step b{display:block;margin-top:8px;font-family:var(--f-d);font-weight:500;font-size:16px;letter-spacing:-.02em;color:var(--ink)}
.y-step b span{color:var(--glow)}
.y-step b span.pop{animation:pop .45s cubic-bezier(.34,1.56,.64,1)}
@keyframes pop{0%{transform:scale(.6);opacity:.2}100%{transform:none;opacity:1}}
.y-step b span{display:inline-block}
.y-step b span:not(:empty){margin-right:.28em}
.yours .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}

@media (max-width:900px){
  .doors{flex-direction:column;height:auto}
  .door{flex:none;height:96px;transition:height .6s cubic-bezier(.2,.8,.2,1),border-color .4s ease}
  .door.on{flex:none;height:300px}
  .ind-top{grid-template-columns:1fr;gap:28px}
  .j-track{display:none}
  .j-steps{grid-template-columns:1fr;gap:10px;margin-top:0;padding-left:34px;position:relative}
  .j-steps::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:2px;background:rgba(205,166,255,.14)}
  .j-steps::after{content:"";position:absolute;left:11px;top:6px;width:2px;height:calc((100% - 12px) * var(--p,0));background:linear-gradient(180deg,var(--violet),var(--pink),#4ADE80)}
  .j-step{padding-top:0;text-align:left}
  .j-step .node{top:14px;left:-34px;margin:0;z-index:1}
  .y-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .y-step:not(:last-child)::after{display:none}
  .yours-in{padding:34px 26px}
  .agent-row{flex-wrap:wrap}
  .ag-msg{margin-left:0;white-space:normal}
}
@media (max-width:600px){
  .i-hero{padding:calc(var(--nav-h) + 36px) 16px 20px}
  .ind,.yours{padding-left:16px;padding-right:16px}
  .ind{padding-top:56px}
  .door-in{padding:16px 18px 18px}
  .ask{flex-wrap:wrap;border-radius:18px;padding:10px 14px}
  .ask label{width:100%}
  .j-label .jsub{display:none}
  .y-flow{grid-template-columns:1fr}
  .yours-in{padding:28px 20px}
}
@media (prefers-reduced-motion:reduce){
  .door,.door img,.door .more,.j-card{transition:none}
}

/* stop the rotating word from moving the layout: the headline and the lead keep fixed columns,
   and the word never wraps (it may overflow its column briefly while scrambling, but nothing reflows) */
@media (min-width:901px){
  .i-hero-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,34ch);align-items:end;gap:32px}
  .rot-title{font-size:clamp(34px,4.6vw,70px)}
}
.rot{white-space:nowrap}
@media (max-width:600px){
  .rot-title{font-size:clamp(26px,8vw,34px)}
}