/* ============================================================
   KNYTEC UPGRADE LAYER — depth, motion, machinery
   Loads after theme.css + redesign.css. Extends, never fights.
   ============================================================ */

/* ---------- design tokens ---------- */
:root{
  --glow: 0 0 24px rgba(255,122,0,.18);
  --glow-strong: 0 0 34px rgba(255,122,0,.32);
  --card-border: linear-gradient(160deg, rgba(255,122,0,.35), rgba(27,40,64,.9) 42%, rgba(27,40,64,.9) 60%, rgba(255,122,0,.14));
  --lift: translateY(-4px);
}

/* ---------- hero: blueprint canvas + aurora ---------- */
.hero{ position:relative; overflow:hidden; }
#blueprint-canvas{
  position:absolute; inset:0; width:100%; height:100%;
  pointer-events:none; z-index:0; opacity:.9;
}
.hero > .wrap{ position:relative; z-index:2; }
.hero::after{
  content:""; position:absolute; z-index:1; pointer-events:none;
  width:820px; height:820px; right:-260px; top:-320px;
  background:radial-gradient(circle, rgba(255,122,0,.13), transparent 62%);
  filter:blur(10px);
}

/* headline staggered word reveal */
.hw{ display:inline-block; opacity:0; transform:translateY(26px);
     transition:opacity .55s var(--ease), transform .55s var(--ease); }
.hw.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .hw{ opacity:1; transform:none; transition:none; } }

/* ---------- ticker marquee ---------- */
.hero-ticker{ overflow:hidden; position:relative; white-space:nowrap; }
.hero-ticker .tk-track{ display:inline-flex; gap:34px; align-items:center;
  animation:tkslide 38s linear infinite; will-change:transform; padding-right:34px; }
@keyframes tkslide{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
.hero-ticker:hover .tk-track{ animation-play-state:paused; }
@media (prefers-reduced-motion: reduce){ .hero-ticker .tk-track{ animation:none; } }

/* ---------- pipeline status strip ---------- */
.pipe{ display:flex; align-items:center; gap:0; margin:34px 0 0;
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em;
  color:#5D6F8C; user-select:none; flex-wrap:wrap; row-gap:10px; }
.pipe .ps{ display:flex; align-items:center; gap:7px; }
.pipe .ps .pd{ width:7px; height:7px; border-radius:50%; background:#243450;
  box-shadow:0 0 0 0 rgba(255,122,0,0); transition:all .4s var(--ease); }
.pipe .ps.on{ color:#BFD9EF; }
.pipe .ps.on .pd{ background:var(--cyan); box-shadow:0 0 10px rgba(255,122,0,.75); }
.pipe .ps.done{ color:#7FA3C2; }
.pipe .ps.done .pd{ background:var(--signal); box-shadow:none; }
.pipe .pl{ width:34px; height:1px; background:#22314E; margin:0 10px; position:relative; overflow:hidden; }
.pipe .pl::after{ content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, var(--cyan), transparent); }
.pipe .pl.flow::after{ animation:plflow 1s var(--ease) forwards; }
@keyframes plflow{ to{ transform:translateX(100%);} }

/* ---------- cards: gradient border + glass + lift ---------- */
.tier, .console, .cwrap, .pcard, .form-card, .icp .good, .icp .bad, .pbx{
  position:relative; transition:transform .22s var(--ease), box-shadow .28s var(--ease); }
.tier:hover, .pbx:hover{ transform:var(--lift); box-shadow:var(--glow); }
.tier--flag{ box-shadow:0 0 0 1px rgba(255,122,0,.35), var(--glow); }
.tier--flag:hover{ box-shadow:0 0 0 1px rgba(255,122,0,.6), var(--glow-strong); }
.console{ backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-shadow:0 24px 70px -20px rgba(0,0,0,.65), 0 0 0 1px rgba(255,122,0,.14); }
.console:hover{ box-shadow:0 24px 70px -20px rgba(0,0,0,.65), 0 0 0 1px rgba(255,122,0,.3), var(--glow); }

/* primary CTA pulse */
.btn-primary{ position:relative; transition:transform .18s var(--ease), box-shadow .25s var(--ease); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 0 26px rgba(255,122,0,.5); }
.btn-primary.pulse{ animation:ctapulse 2.6s ease-in-out infinite; }
@keyframes ctapulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,122,0,.35);} 50%{ box-shadow:0 0 22px 2px rgba(255,122,0,.5);} }
@media (prefers-reduced-motion: reduce){ .btn-primary.pulse{ animation:none; } }

/* ---------- rail scroll progress ---------- */
.rail .rn{ transition:color .3s var(--ease), text-shadow .3s var(--ease); }
.sec.rail-on .rail .rn{ color:var(--cyan); text-shadow:0 0 18px rgba(255,122,0,.5); }
.rail .rtick{ position:relative; overflow:hidden; }
.rail .rtick::after{ content:""; position:absolute; left:0; top:0; width:100%; height:0%;
  background:var(--cyan); transition:height .9s var(--ease); }
.sec.rail-on .rail .rtick::after{ height:100%; }

/* ---------- count-up ---------- */
.cnt{ font-variant-numeric:tabular-nums; }

/* ---------- section reveal refinement ---------- */
.reveal{ transition-duration:.55s; }
.reveal:nth-child(2){ transition-delay:.06s; }
.reveal:nth-child(3){ transition-delay:.12s; }

/* ---------- activity ticker (footer of hero console) ---------- */
.actline{ display:flex; align-items:center; gap:8px; margin-top:10px;
  font-family:var(--font-mono); font-size:.6rem; color:#54677F; letter-spacing:.05em;
  min-height:16px; overflow:hidden; }
.actline .adot{ width:5px; height:5px; border-radius:50%; background:var(--signal); flex:none;
  animation:ablink 2s ease-in-out infinite; }
@keyframes ablink{ 50%{ opacity:.25; } }
.actline .atxt{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:0; transition:opacity .45s ease; }
.actline .atxt.in{ opacity:1; }

/* ---------- forms: states ---------- */
.field input.err, .field select.err{ border-color:#E0526B !important; box-shadow:0 0 0 1px rgba(224,82,107,.4); }
.field .fmsg{ font-family:var(--font-mono); font-size:.62rem; color:#E0526B; margin-top:5px; display:none; }
.field.bad .fmsg{ display:block; }
.form-submit[disabled]{ opacity:.55; cursor:progress; }
.form-success{ text-align:center; padding:42px 20px; }
.form-fallback{ display:none; margin-top:14px; font-size:.85rem; color:#E0526B; }
.form-fallback.show{ display:block; }
.consent{ font-size:.72rem; color:#5D6F8C; margin-top:12px; line-height:1.5; }
.consent a{ color:var(--cyan); text-decoration:none; }
input.bc-field{ position:absolute; left:-9999px; opacity:0; height:0; width:0; }

/* ---------- policy pages ---------- */
.legal-wrap{ max-width:760px; margin:0 auto; padding:70px 24px 90px; color:#C7D3E4; }
.legal-wrap h1{ font-size:clamp(1.8rem,4vw,2.6rem); color:#fff; margin-bottom:6px; }
.legal-wrap .lmeta{ font-family:var(--font-mono); font-size:.68rem; color:#5D6F8C;
  letter-spacing:.08em; text-transform:uppercase; margin-bottom:36px; }
.legal-wrap h2{ font-size:1.15rem; color:#fff; margin:34px 0 10px;
  padding-top:22px; border-top:1px solid #1B2840; }
.legal-wrap p, .legal-wrap li{ font-size:.95rem; line-height:1.75; margin-bottom:12px; }
.legal-wrap ul{ padding-left:20px; margin-bottom:14px; }
.legal-wrap a{ color:var(--cyan); text-decoration:none; }
.legal-wrap .lbox{ background:#0D1626; border:1px solid #1B2840; border-radius:10px;
  padding:18px 22px; margin:18px 0; }

/* ---------- 404 ---------- */
.nf{ min-height:72vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:40px 24px; }
.nf .code{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.2em; color:var(--cyan); margin-bottom:14px; }
.nf h1{ font-size:clamp(1.9rem,5vw,3rem); color:#fff; margin-bottom:14px; }
.nf p{ color:#8CA0BC; margin-bottom:28px; }
.nf .row{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ---------- who-its-for qualifier ---------- */
.qual{ margin-top:26px; border:1px solid rgba(255,122,0,.28); border-radius:12px;
  padding:22px 26px; background:linear-gradient(150deg, rgba(255,122,0,.07), rgba(13,22,38,.6));
  display:flex; gap:16px; align-items:flex-start; }
.qual .qn{ font-family:var(--font-mono); color:var(--cyan); font-size:.66rem;
  letter-spacing:.12em; text-transform:uppercase; padding-top:4px; flex:none; }
.qual p{ margin:0; color:#D8E4F2; font-size:1rem; line-height:1.65; }
.qual strong{ color:#fff; }

/* ---------- mobile ---------- */
@media (max-width:760px){
  .pipe{ font-size:.56rem; }
  .pipe .pl{ width:18px; margin:0 6px; }
  .qual{ flex-direction:column; gap:8px; }
}

/* ---------- thank-you page ---------- */
.ty{ position:relative; min-height:78vh; display:flex; align-items:center; overflow:hidden;
  background:#080D17; padding:70px 0 90px; }
.ty-in{ position:relative; z-index:2; max-width:640px; }
.ty-icon{ width:52px; height:52px; border-radius:50%; background:var(--cyan);
  display:flex; align-items:center; justify-content:center; margin-bottom:26px;
  box-shadow:0 0 30px rgba(255,122,0,.4); }
.ty h1{ font-size:clamp(2rem,4.6vw,3rem); color:#fff; margin:14px 0 14px; line-height:1.12; }
.ty .lead{ font-size:1.05rem; color:#9FB4CE; line-height:1.7; max-width:520px; margin-bottom:40px; }
.ty-steps{ display:flex; flex-direction:column; gap:22px; margin-bottom:44px; }
.ty-step{ display:flex; gap:16px; align-items:flex-start; }
.ty-step .ca-k{ color:#fff; font-weight:600; margin-bottom:4px; }
.ty-step .ca-v{ color:#8CA0BC; font-size:.92rem; line-height:1.6; }
.ty-cta{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:20px 0;
  border-top:1px solid #1B2840; margin-bottom:22px; }
.ty-cta span{ color:#8CA0BC; font-size:.92rem; }
.ty-back{ color:#5D6F8C; font-size:.85rem; text-decoration:none; }
.ty-back:hover{ color:var(--cyan); }
@media (max-width:640px){ .ty{ padding:50px 0 70px; } }