/* =========================================================
   DIGIMATO — gemeinsames Design-System (hell & hochwertig)
   ========================================================= */

:root{
  /* Flächen */
  --bg:#FFFFFF;
  --bg-soft:#F1F6FD;      /* zart getönte Sektion */
  --bg-tint:#E9F1FF;      /* Akzentfläche */
  --bg-deep:#0A1B3D;      /* dunkles Navy-Band (Kontrast) */
  --bg-deep-2:#0E2657;

  /* Text */
  --ink:#0B1524;
  --ink-soft:#33415C;
  --muted:#64748B;
  --on-dark:#EAF1FF;
  --on-dark-muted:#9DB2D9;

  /* Marke */
  --brand:#1D6FE8;
  --brand-ink:#0B4DC0;
  --brand-light:#4D9EFF;
  --brand-050:#EAF2FF;
  --glow:rgba(37,111,232,0.30);

  /* Linien & Schatten */
  --line:rgba(11,21,36,0.10);
  --line-strong:rgba(11,21,36,0.16);
  --shadow-sm:0 2px 12px rgba(11,21,36,0.06);
  --shadow:0 22px 60px -28px rgba(11,21,36,0.32);
  --shadow-brand:0 22px 55px -22px rgba(37,111,232,0.55);

  --radius:18px;
  --radius-lg:26px;
  --container:1180px;

  --display:'Space Grotesk', sans-serif;
  --body:'Source Sans 3', system-ui, sans-serif;
  --mono:'IBM Plex Mono', monospace;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; color-scheme:light; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--body);
  background:var(--bg);
  color:var(--ink);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,video,canvas{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--brand); color:#fff; }
:focus-visible{ outline:2px solid var(--brand); outline-offset:3px; border-radius:6px; }

h1,h2,h3,h4{ font-family:var(--display); letter-spacing:-0.025em; line-height:1.08; font-weight:600; color:var(--ink); }
h2{ font-size:clamp(2rem, 4vw, 3.1rem); }
h3{ font-size:1.35rem; letter-spacing:-0.01em; }

.wrap{ max-width:var(--container); margin:0 auto; padding:0 28px; }
.narrow{ max-width:760px; }

/* ---------- Eyebrow / Kicker ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--brand-ink); font-weight:500;
  margin-bottom:18px;
}
.eyebrow::before{
  content:""; width:26px; height:1.5px; background:var(--brand); border-radius:2px;
}
.section-dark .eyebrow{ color:var(--brand-light); }
.section-dark .eyebrow::before{ background:var(--brand-light); }

.lead{ font-size:1.13rem; color:var(--ink-soft); max-width:56ch; }
.section-dark .lead{ color:var(--on-dark-muted); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 26px; border-radius:13px; font-weight:600; font-size:0.97rem;
  font-family:var(--body); cursor:pointer; border:1.5px solid transparent;
  transition:transform .18s ease, box-shadow .22s ease, background .2s, color .2s, border-color .2s;
  white-space:nowrap;
}
.btn svg{ width:18px; height:18px; }
.btn-primary{ background:var(--brand); color:#fff; box-shadow:var(--shadow-brand); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 26px 60px -18px rgba(37,111,232,0.7); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn-ghost:hover{ border-color:var(--brand); color:var(--brand-ink); transform:translateY(-2px); }
.btn-light{ background:#fff; color:var(--brand-ink); box-shadow:var(--shadow); }
.btn-light:hover{ transform:translateY(-2px); }
.section-dark .btn-ghost{ color:#fff; border-color:rgba(255,255,255,0.28); }
.section-dark .btn-ghost:hover{ border-color:#fff; color:#fff; background:rgba(255,255,255,0.06); }
.btn-lg{ padding:16px 32px; font-size:1.03rem; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.82);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--line);
}
.nav{ display:flex; align-items:center; gap:20px; height:70px; }
.brand{ display:flex; align-items:center; gap:11px; font-family:var(--display); font-weight:600; font-size:1.22rem; letter-spacing:-0.02em; transition:color .25s; }
.brand img{ width:30px; height:30px; border-radius:8px; box-shadow:var(--shadow-sm); transform-origin:50% 100%; animation:brand-hop 10s ease-in-out infinite; transition:transform .25s; }
/* Kleiner Hüpfer etwa alle 10 Sekunden, damit das Logo lebendig wirkt */
@keyframes brand-hop{
  0%, 90%, 100%{ transform:translateY(0) rotate(0); }
  93%{ transform:translateY(-7px) rotate(-7deg); }
  95%{ transform:translateY(0) rotate(5deg); }
  97%{ transform:translateY(-3px) rotate(-2deg); }
  99%{ transform:translateY(0) rotate(0); }
}
/* Beim Drüberfahren reagiert das ganze Logo lebendig */
.brand:hover img{ animation:none; transform:translateY(-4px) scale(1.1) rotate(-6deg); }
.brand:hover{ color:var(--brand-ink); }
.brand-word{ display:inline-block; transition:transform .25s, letter-spacing .25s; }
.brand:hover .brand-word{ transform:scale(1.03); letter-spacing:0; }
@media (prefers-reduced-motion:reduce){ .brand img{ animation:none; } }
.nav-links{ display:flex; align-items:center; gap:4px; margin-left:22px; }
.nav-links a{
  padding:9px 15px; border-radius:10px; font-size:0.95rem; font-weight:500;
  color:var(--ink-soft); transition:background .18s, color .18s;
}
.nav-links a:hover{ background:var(--bg-soft); color:var(--ink); }
.nav-links a[aria-current="page"]{ color:var(--brand-ink); background:var(--brand-050); }
.nav-links .btn{ display:none; }
/* Auffälliger Produkt-Link in der Navigation */
.nav-links a.nav-product{
  color:#fff; font-weight:700;
  background:linear-gradient(120deg, var(--brand), var(--brand-light));
  border-radius:22px; padding:8px 16px;
  box-shadow:0 6px 18px -6px var(--glow);
  position:relative;
  animation:navpulse 2.4s ease-in-out infinite;
}
.nav-links a.nav-product:hover{
  color:#fff; transform:translateY(-1px);
  box-shadow:0 10px 24px -6px var(--glow);
}
@keyframes navpulse{
  0%,100%{ box-shadow:0 6px 18px -6px var(--glow), 0 0 0 0 rgba(37,111,232,0.45); }
  50%{ box-shadow:0 8px 22px -6px var(--glow), 0 0 0 6px rgba(37,111,232,0); }
}
@media (prefers-reduced-motion:reduce){ .nav-links a.nav-product{ animation:none; } }
.nav-cta{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.nav-toggle{ display:none; background:none; border:none; cursor:pointer; padding:8px; color:var(--ink); }
.nav-toggle svg{ width:26px; height:26px; }

@media (max-width:900px){
  .nav-cta .btn{ display:none; }
  .nav-toggle{ display:block; margin-left:auto; }
  .nav-links{
    position:fixed; inset:70px 0 auto 0;
    flex-direction:column; align-items:stretch; gap:2px; margin:0;
    background:#fff; border-bottom:1px solid var(--line);
    padding:14px 20px 22px; box-shadow:var(--shadow);
    transform:translateY(-140%); transition:transform .32s cubic-bezier(.4,0,.2,1);
  }
  .nav-links.is-open{ transform:translateY(0); }
  .nav-links a{ padding:14px 15px; font-size:1.05rem; }
  .nav-links .btn{ display:inline-flex; margin-top:10px; }
}

/* ---------- Sektionen ---------- */
.section{ padding:96px 0; }
.section-sm{ padding:70px 0; }
.section-soft{ background:var(--bg-soft); }
.section-dark{
  background:
    radial-gradient(ellipse 80% 60% at 50% -10%, rgba(77,158,255,0.18), transparent 60%),
    linear-gradient(160deg, var(--bg-deep), var(--bg-deep-2));
  color:var(--on-dark);
}
.section-dark h1, .section-dark h2, .section-dark h3, .section-dark h4{ color:#fff; }
.section-head{ max-width:640px; margin-bottom:52px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head.center .eyebrow{ justify-content:center; }

/* ---------- HERO ---------- */
.hero{ position:relative; overflow:hidden; padding:104px 0 92px; }
.hero-bg{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(closest-side 40% 60% at 82% 8%, rgba(77,158,255,0.16), transparent),
    radial-gradient(closest-side 55% 55% at 12% 90%, rgba(37,111,232,0.10), transparent);
}
#orbit{ position:absolute; inset:0; z-index:0; width:100%; height:100%; opacity:0.9; }
.hero .wrap{ position:relative; z-index:1; }
.hero-inner{ max-width:760px; }
.hero h1{ font-size:clamp(2.6rem, 6vw, 4.6rem); margin:18px 0 22px; }
.hero h1 .grad{
  background:linear-gradient(100deg, var(--brand) 10%, var(--brand-light) 90%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero .lead{ font-size:1.24rem; max-width:52ch; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.hero-trust{ display:flex; flex-wrap:wrap; gap:26px; margin-top:44px; color:var(--muted); font-size:0.9rem; }
.hero-trust span{ display:inline-flex; align-items:center; gap:8px; }
.hero-trust svg{ width:18px; height:18px; color:var(--brand); }

/* ---------- Stat-Reihe ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.stat{ padding:6px 4px; }
.stat b{ display:block; font-family:var(--display); font-size:2.5rem; font-weight:600; letter-spacing:-0.03em; color:var(--brand-ink); }
.section-dark .stat b{ color:var(--brand-light); }
.stat span{ color:var(--muted); font-size:0.95rem; }
.section-dark .stat span{ color:var(--on-dark-muted); }

/* ---------- Feature-Karten ---------- */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr)); gap:22px; }
.feature{
  position:relative; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); padding:30px 28px;
  box-shadow:var(--shadow-sm); transition:transform .22s, box-shadow .22s, border-color .22s;
  overflow:hidden;
}
.feature:hover{ transform:translateY(-6px); box-shadow:var(--shadow); border-color:rgba(37,111,232,0.35); }
.feature .ico{
  width:50px; height:50px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  background:var(--brand-050); color:var(--brand-ink); margin-bottom:18px;
}
.feature .ico svg{ width:24px; height:24px; }
.feature h3{ margin-bottom:9px; }
.feature p{ color:var(--muted); font-size:0.96rem; }
.feature .meta{
  margin-top:18px; padding-top:15px; border-top:1px dashed var(--line);
  font-family:var(--mono); font-size:0.68rem; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--brand-ink); display:flex; justify-content:space-between; gap:10px;
}

/* ---------- Steps / Ablauf ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; counter-reset:step; }
.step{
  position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:28px 24px; box-shadow:var(--shadow-sm);
}
.step .n{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.12em; color:var(--brand-ink);
  display:inline-block; margin-bottom:14px;
}
.step h3{ font-size:1.15rem; margin-bottom:8px; }
.step p{ color:var(--muted); font-size:0.93rem; }
.section-soft .step{ background:#fff; }

/* ---------- Preise ---------- */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch; }
.price{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:34px 30px; box-shadow:var(--shadow-sm);
  transition:transform .22s, box-shadow .22s;
}
.price:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.price.featured{
  border:1.5px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(160deg, var(--brand), var(--brand-light)) border-box;
  box-shadow:var(--shadow-brand);
}
.price .tag{
  align-self:flex-start; font-family:var(--mono); font-size:0.66rem; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--brand-ink); background:var(--brand-050);
  padding:5px 12px; border-radius:20px; margin-bottom:16px;
}
.price.featured .tag{ background:var(--brand); color:#fff; }
.price h3{ font-size:1.45rem; margin-bottom:14px; }
.price .amount{ font-family:var(--display); font-size:2.6rem; font-weight:600; letter-spacing:-0.03em; color:var(--ink); }
.price .amount small{ font-size:0.9rem; font-weight:400; color:var(--muted); letter-spacing:0; }
.price ul{ list-style:none; margin:22px 0 26px; display:flex; flex-direction:column; gap:12px; }
.price li{ position:relative; padding-left:28px; color:var(--ink-soft); font-size:0.95rem; }
.price li::before{
  content:""; position:absolute; left:0; top:3px; width:18px; height:18px; border-radius:50%;
  background:var(--brand-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D6FE8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
}
.price > .btn{ margin-top:auto; }
.price-actions{ margin-top:auto; display:grid; gap:10px; }
.btn-preview{ background:var(--bg-tint); color:var(--brand-ink); }
.btn-preview:hover{ background:var(--brand-050); transform:translateY(-2px); }

/* ---------- Produkt-Spotlight (Backoffice OS) ---------- */
.spotlight{
  position:relative; overflow:hidden;
  background:
    radial-gradient(ellipse 60% 70% at 88% 0%, rgba(77,158,255,0.20), transparent 60%),
    linear-gradient(160deg, #0E2657, #0A1B3D);
  border:1px solid rgba(255,255,255,0.09); border-radius:var(--radius-lg);
  padding:48px; color:var(--on-dark); box-shadow:var(--shadow);
}
.spotlight-badge{
  position:absolute; top:22px; right:22px; z-index:2;
  background:var(--brand); color:#fff; font-family:var(--mono); font-size:0.64rem;
  letter-spacing:0.12em; text-transform:uppercase; padding:6px 13px; border-radius:20px;
}
.spotlight-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:44px; align-items:center; position:relative; z-index:1; }
.spotlight .eyebrow{ color:var(--brand-light); }
.spotlight .eyebrow::before{ background:var(--brand-light); }
.spotlight h2{ color:#fff; margin:12px 0 14px; }
.spotlight .lead{ color:var(--on-dark-muted); }
.spotlight-list{ list-style:none; display:grid; gap:11px; margin:24px 0 30px; }
.spotlight-list li{ position:relative; padding-left:30px; color:var(--on-dark); font-size:0.97rem; }
.spotlight-list li::before{
  content:""; position:absolute; left:0; top:2px; width:19px; height:19px; border-radius:50%;
  background:rgba(77,158,255,0.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234D9EFF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;
}
.spotlight-cta{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.spotlight-price{ color:var(--on-dark-muted); font-size:0.92rem; }
.spotlight-price b{ color:#fff; font-weight:600; }
/* Mock-UI im Spotlight */
.mock{ background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.10); border-radius:16px; padding:18px; box-shadow:0 20px 50px -24px rgba(0,0,0,0.6); }
.mock-head{ display:flex; align-items:center; gap:8px; font-family:var(--mono); font-size:0.66rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--on-dark-muted); margin-bottom:14px; }
.mock-head .d{ width:9px; height:9px; border-radius:50%; background:var(--brand-light); }
.mock-row{ display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:10px; background:rgba(255,255,255,0.03); margin-bottom:9px; }
.mock-row .doc{ width:30px; height:30px; border-radius:8px; background:rgba(77,158,255,0.15); display:flex; align-items:center; justify-content:center; font-size:0.95rem; flex:0 0 30px; }
.mock-row .t{ flex:1; min-width:0; }
.mock-row .t b{ display:block; font-size:0.82rem; color:var(--on-dark); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mock-row .t span{ font-size:0.72rem; color:var(--on-dark-muted); }
.mock-row .conf{ font-family:var(--mono); font-size:0.72rem; color:var(--brand-light); flex:0 0 auto; }
@media(max-width:820px){ .spotlight{ padding:34px 26px; } .spotlight-grid{ grid-template-columns:1fr; gap:30px; } .spotlight-badge{ position:static; display:inline-block; margin-bottom:14px; } }

/* ---------- CTA-Band ---------- */
.cta-band{ text-align:center; }
.cta-band h2{ margin-bottom:16px; }
.cta-band .actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:30px; }

/* ---------- Kontakt ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:52px; align-items:start; }
.contact-detail{ display:flex; align-items:flex-start; gap:14px; margin-bottom:20px; }
.contact-detail svg{ width:20px; height:20px; color:var(--brand); flex:0 0 20px; margin-top:3px; }
.contact-detail strong{ display:block; font-size:1.02rem; }
.contact-detail span{ color:var(--muted); font-size:0.9rem; }

form.card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px; box-shadow:var(--shadow); }
form .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field{ margin-bottom:16px; }
label{ display:block; font-size:0.82rem; font-weight:600; margin-bottom:7px; }
input,textarea,select{
  width:100%; padding:13px 15px; border:1px solid var(--line-strong); border-radius:12px;
  background:#fff; color:var(--ink); font-family:var(--body); font-size:0.96rem;
  transition:border-color .18s, box-shadow .18s;
}
input::placeholder,textarea::placeholder{ color:#9AA7B8; }
input:focus,textarea:focus,select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px rgba(37,111,232,0.12); }
select{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:18px; padding-right:42px; }
textarea{ resize:vertical; min-height:120px; }
.form-note{ font-size:0.82rem; color:var(--muted); margin-top:12px; }

/* ---------- Über uns ---------- */
.founders{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.founder{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px; box-shadow:var(--shadow-sm); text-align:center; }
.founder .avatar{
  width:104px; height:104px; border-radius:50%; margin:0 auto 18px;
  background:linear-gradient(150deg, var(--brand-050), var(--bg-tint));
  display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-size:2.1rem; font-weight:600; color:var(--brand-ink);
  border:1px solid var(--line);
}
.founder h3{ margin-bottom:4px; }
.founder .role{ color:var(--brand-ink); font-size:0.9rem; font-weight:600; margin-bottom:12px; }
.founder p{ color:var(--muted); font-size:0.95rem; }
.values{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.value{ text-align:left; }
.value .ico{ width:46px; height:46px; border-radius:12px; background:var(--brand-050); color:var(--brand-ink); display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.value .ico svg{ width:22px; height:22px; }
.value h3{ font-size:1.1rem; margin-bottom:7px; }
.value p{ color:var(--muted); font-size:0.94rem; }

/* ---------- Video-Band ---------- */
.video-band{ position:relative; overflow:hidden; border-radius:var(--radius-lg); }
.video-band video{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.video-band .tint{ position:absolute; inset:0; background:linear-gradient(120deg, rgba(10,27,61,0.86), rgba(14,38,87,0.66)); }
.video-band .inner{ position:relative; z-index:1; padding:70px 50px; color:#fff; max-width:620px; }
.video-band h2{ color:#fff; margin-bottom:14px; }
.video-band p{ color:var(--on-dark-muted); }

/* =========================================================
   KI-PIPELINE DEMO (dunkler Showcase auf heller Seite)
   ========================================================= */
.demo{
  position:relative; margin:0 auto; max-width:980px;
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%, rgba(77,158,255,0.10), transparent 70%),
    linear-gradient(160deg, #0E2657, #0A1B3D);
  border:1px solid rgba(255,255,255,0.10); border-radius:var(--radius-lg);
  padding:24px 26px 18px; overflow:hidden; box-shadow:var(--shadow);
}
.pipe-head{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-family:var(--mono); font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--on-dark-muted); margin-bottom:18px; }
.live-dot{ width:8px; height:8px; border-radius:50%; background:var(--brand-light); flex:0 0 8px; animation:livepulse 1.6s ease-in-out infinite; }
@keyframes livepulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(77,158,255,0.55);} 50%{ box-shadow:0 0 0 7px rgba(77,158,255,0);} }
.pipe-stats{ margin-left:auto; display:flex; gap:20px; }
.pipe-stats strong{ color:var(--brand-light); font-weight:500; }
.pipe-stage{ display:grid; grid-template-columns:1fr 200px 1fr; gap:16px; align-items:stretch; min-height:300px; }
.pl-col-label{ font-family:var(--mono); font-size:0.62rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--on-dark-muted); margin-bottom:12px; }
.pl-inbox{ position:relative; }
.pl-mail{ position:relative; width:100%; max-width:250px; background:rgba(242,244,247,0.97); border-radius:10px; padding:10px 13px; margin-bottom:10px; font-size:0.75rem; color:#101722; box-shadow:0 8px 22px rgba(0,0,0,0.4); opacity:0; transform:translateX(-36px) rotate(-3deg); }
.pl-mail.is-in{ opacity:1; transform:none; transition:opacity .55s ease, transform .55s cubic-bezier(.2,.9,.3,1.2); }
.pl-mail .from{ font-weight:600; font-size:0.73rem; }
.pl-mail .subj{ color:#5a6472; font-size:0.69rem; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pl-core-wrap{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; }
.pl-core{ position:relative; width:150px; height:150px; }
.core-ring{ position:absolute; inset:0; border-radius:50%; background:conic-gradient(from 0deg, transparent 0 40%, var(--brand-light) 50%, transparent 60% 100%); -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px)); mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px)); animation:ringspin 3.2s linear infinite; opacity:0.9; }
.core-ring.r2{ inset:12px; background:conic-gradient(from 180deg, transparent 0 55%, rgba(234,242,255,0.8) 65%, transparent 75% 100%); animation:ringspin 4.6s linear infinite reverse; opacity:0.5; }
@keyframes ringspin{ to{ transform:rotate(360deg);} }
.core-inner{ position:absolute; inset:26px; border-radius:50%; background:radial-gradient(circle at 38% 32%, rgba(77,158,255,0.25), rgba(12,16,22,0.9) 70%); border:1px solid rgba(77,158,255,0.35); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; transition:box-shadow .3s; }
.pl-core.is-busy .core-inner{ box-shadow:0 0 34px -4px var(--glow), inset 0 0 22px rgba(77,158,255,0.25); }
.core-inner svg{ width:26px; height:26px; stroke:var(--brand-light); }
.pl-core.is-busy .core-inner svg{ animation:corethink 0.7s ease-in-out infinite alternate; }
@keyframes corethink{ from{ transform:scale(1);} to{ transform:scale(1.14);} }
.core-conf{ font-family:var(--mono); font-size:0.78rem; color:var(--brand-light); min-height:1.1em; font-weight:500; }
.core-scan{ position:absolute; left:8%; right:8%; top:50%; height:2px; border-radius:2px; background:linear-gradient(90deg, transparent, var(--brand-light), transparent); box-shadow:0 0 14px 2px var(--glow); opacity:0; pointer-events:none; }
.pl-core.is-busy .core-scan{ opacity:1; animation:scanline 0.9s ease-in-out infinite alternate; }
@keyframes scanline{ from{ transform:translateY(-34px);} to{ transform:translateY(34px);} }
.core-label{ font-family:var(--mono); font-size:0.66rem; color:var(--on-dark-muted); letter-spacing:0.08em; text-align:center; min-height:1.2em; }
.pl-cats{ display:flex; flex-direction:column; }
.cat-slot{ display:flex; align-items:center; gap:9px; border:1px solid rgba(255,255,255,0.10); border-radius:10px; padding:11px 14px; margin-bottom:9px; font-size:0.78rem; color:var(--on-dark); background:rgba(255,255,255,0.03); transition:border-color .3s, background .3s; }
.cat-slot b{ margin-left:auto; font-family:var(--mono); font-weight:500; font-size:0.8rem; color:var(--on-dark-muted); transition:color .3s; }
.cat-slot.is-hit{ border-color:rgba(77,158,255,0.65); background:rgba(77,158,255,0.12); }
.cat-slot.is-hit b{ color:var(--brand-light); }
.cat-dot{ width:7px; height:7px; border-radius:50%; flex:0 0 7px; }
.pl-chip{ position:absolute; z-index:5; pointer-events:none; font-family:var(--mono); font-size:0.62rem; letter-spacing:0.05em; padding:4px 11px; border-radius:20px; white-space:nowrap; background:rgba(77,158,255,0.18); color:var(--brand-light); border:1px solid rgba(77,158,255,0.6); box-shadow:0 0 18px -2px var(--glow); }
.pl-log{ margin-top:18px; border-top:1px dashed rgba(255,255,255,0.12); padding-top:12px; font-family:var(--mono); font-size:0.68rem; line-height:1.75; color:var(--on-dark-muted); min-height:76px; }
.pl-log .ln{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pl-log .ln.ok{ color:var(--brand-light); }
.pl-log .cursor{ display:inline-block; width:7px; height:12px; background:var(--brand-light); vertical-align:-2px; margin-left:2px; animation:blinkc 0.9s steps(1) infinite; }
@keyframes blinkc{ 50%{ opacity:0; } }

/* ---------- Footer ---------- */
.site-footer{ background:var(--bg-deep); color:var(--on-dark-muted); padding:60px 0 30px; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.10); }
.footer-brand{ display:flex; align-items:center; gap:11px; font-family:var(--display); font-weight:600; font-size:1.2rem; color:#fff; margin-bottom:14px; }
.footer-brand img{ width:28px; height:28px; border-radius:7px; }
.footer-grid > div p{ font-size:0.9rem; max-width:32ch; }
.footer-col h4{ font-family:var(--mono); font-size:0.66rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--on-dark); margin-bottom:15px; }
.footer-col a{ display:block; font-size:0.9rem; margin-bottom:10px; color:var(--on-dark-muted); transition:color .18s; }
.footer-col a:hover{ color:#fff; }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:22px; font-size:0.8rem; }

/* ---------- Reveal-Animation ---------- */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.07s; } .reveal.d2{ transition-delay:.14s; }
.reveal.d3{ transition-delay:.21s; } .reveal.d4{ transition-delay:.28s; }

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .section{ padding:70px 0; }
  .stats{ grid-template-columns:repeat(2,1fr); gap:28px 16px; }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .price-grid{ grid-template-columns:1fr; max-width:440px; margin-left:auto; margin-right:auto; }
  .contact-grid{ grid-template-columns:1fr; gap:36px; }
  .founders{ grid-template-columns:1fr; }
  .values{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:30px; }
  .video-band .inner{ padding:52px 30px; }
}
@media (max-width:620px){
  .wrap{ padding:0 20px; }
  form .form-row{ grid-template-columns:1fr; }
  .pipe-stage{ grid-template-columns:1fr; }
  .pl-core-wrap{ order:-1; }
  .pl-core{ width:120px; height:120px; }
  .core-inner{ inset:20px; }
  .pl-mail{ max-width:none; }
  .footer-grid{ grid-template-columns:1fr; }
  .hero-trust{ gap:14px; }
}
@media (prefers-reduced-motion:reduce){
  *{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .core-ring,.core-ring.r2,.live-dot,.pl-core.is-busy .core-inner svg,.pl-core.is-busy .core-scan{ animation:none; }
  .pl-mail{ opacity:1; transform:none; transition:none; }
}