.logic-hero {
  min-height: 86vh;
  padding: 9rem 2rem 5rem;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}
.logic-hero::before {
  content: '';
  position: absolute;
  width: 620px;
  height: 620px;
  border-radius: 50%;
  background: rgba(255,87,34,.16);
  filter: blur(130px);
  top: -220px;
  right: -120px;
}
.logic-hero::after {
  content: '';
  position: absolute;
  width: 480px;
  height: 480px;
  border-radius: 50%;
  background: rgba(0,229,255,.1);
  filter: blur(120px);
  bottom: -220px;
  left: -100px;
}
.logic-hero-grid {
  width: min(1180px, 100%);
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 1;
}
.logic-hero h1 {
  font-family: var(--font-display);
  font-size: clamp(3.1rem, 8vw, 6.8rem);
  line-height: .94;
  letter-spacing: -.045em;
  margin: .9rem 0 1.4rem;
}
.logic-hero h1 span { color: var(--brand-primary); }
.logic-hero .lead {
  max-width: 650px;
  color: var(--brand-muted);
  font-size: clamp(1.05rem, 2vw, 1.28rem);
}
.logic-actions { display:flex; gap:1rem; flex-wrap:wrap; margin-top:2rem; }
.logic-preview {
  position: relative;
  padding: 1.4rem;
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 35px 90px rgba(0,0,0,.45);
}
.logic-preview img { width:100%; display:block; border-radius:18px; }
.logic-preview-badge {
  position:absolute; left:-18px; bottom:28px;
  padding:.7rem 1rem; border-radius:999px;
  background:var(--brand-secondary); color:#071014;
  font-weight:800; font-size:.82rem; text-transform:uppercase; letter-spacing:.06em;
}
.logic-section { padding: 6rem 2rem; }
.logic-section.alt { background: rgba(255,255,255,.018); border-block:1px solid var(--brand-card-border); }
.logic-section-head { max-width:760px; margin-bottom:2.5rem; }
.logic-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem; }
.logic-card {
  display:flex; flex-direction:column; min-height:270px;
  padding:1.6rem; border-radius:var(--radius);
  background:var(--brand-card); border:1px solid var(--brand-card-border);
  text-decoration:none; color:var(--brand-text);
  transition:transform .2s,border-color .2s,box-shadow .2s;
}
.logic-card:hover { transform:translateY(-5px); border-color:rgba(255,87,34,.55); box-shadow:0 20px 50px rgba(0,0,0,.28); }
.logic-card-icon { font-family:var(--font-display); color:var(--brand-primary); font-size:1.2rem; margin-bottom:auto; }
.logic-card h3 { font-family:var(--font-head); font-size:1.45rem; margin:1.8rem 0 .55rem; }
.logic-card p { color:var(--brand-muted); font-size:.96rem; }
.logic-card span { color:var(--brand-secondary); margin-top:1rem; font-weight:700; }
.workflow-strip { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:1rem; margin-top:2.5rem; }
.workflow-step { padding:1.5rem; text-align:center; background:var(--brand-card); border:1px solid var(--brand-card-border); border-radius:var(--radius); }
.workflow-step strong { display:block; font-family:var(--font-head); font-size:1.2rem; }
.workflow-step small { color:var(--brand-muted); }
.workflow-arrow { color:var(--brand-primary); font-size:1.8rem; }
.logic-note { margin-top:3rem; padding:1.5rem; border-left:4px solid var(--brand-secondary); background:rgba(0,229,255,.06); border-radius:0 12px 12px 0; color:var(--brand-muted); }
@media (max-width: 900px) {
  .logic-hero-grid { grid-template-columns:1fr; gap:2.5rem; }
  .logic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .logic-hero { padding-top:8rem; }
  .logic-grid { grid-template-columns:1fr; }
  .workflow-strip { grid-template-columns:1fr; }
  .workflow-arrow { transform:rotate(90deg); }
  .logic-preview-badge { left:8px; bottom:18px; }
}