.om-section { padding: var(--om-sp-8) 0; }
.om-section--tight { padding: var(--om-sp-7) 0; }
.om-section--surface {
  background: var(--om-surface);
  border-radius: var(--om-r-xl);
  margin-inline: clamp(8px, 1.6vw, 24px);
}
.om-section--dark {
  background: var(--om-grad-dark);
  border-radius: var(--om-r-xl);
  margin-inline: clamp(8px, 1.6vw, 24px);
  color: rgba(255, 227, 205, 0.85);
}
.om-section--dark h2, .om-section--dark h3 { color: var(--om-light); }

.om-hero {
  position: relative; overflow: hidden;
  background: var(--om-grad-glow);
  padding: clamp(56px, 8vw, 112px) 0 clamp(64px, 8vw, 120px);
}
.om-hero::before {
  content: ""; position: absolute; inset: 0;
  background: var(--om-grad-dawn);
  pointer-events: none;
}
.om-hero::after {

  content: ""; position: absolute;
  width: 560px; height: 560px; right: -160px; top: -180px;
  background: var(--om-grad-fire); opacity: 0.12;
  border-radius: 42% 58% 62% 38% / 46% 44% 56% 54%;
  transform: rotate(25deg);
  pointer-events: none;
}
.om-hero__inner {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.02fr 0.98fr;
  gap: clamp(32px, 5vw, 72px); align-items: center;
}
.om-hero__copy h1 { margin-bottom: var(--om-sp-4); }
.om-hero__copy h1 em { font-style: normal; color: var(--om-primary); }
.om-hero__sub { font-size: var(--om-fs-md); color: var(--om-ink-soft); max-width: 34em; }
.om-hero__actions { display: flex; flex-wrap: wrap; gap: var(--om-sp-3); margin-top: var(--om-sp-6); }
.om-hero__meta {
  display: flex; flex-wrap: wrap; gap: var(--om-sp-4);
  margin-top: var(--om-sp-6); font-size: var(--om-fs-xs); color: var(--om-ink-soft);
}
.om-hero__meta span { display: inline-flex; align-items: center; gap: 7px; }
.om-hero__meta svg { width: 16px; height: 16px; color: var(--om-primary); }

@media (max-width: 980px) {
  .om-hero__inner { grid-template-columns: 1fr; }
}

.om-term {
  background: var(--om-dark);
  border-radius: var(--om-r-lg);
  box-shadow: var(--om-shadow-dark), 0 0 0 1px rgba(255, 158, 79, 0.22);
  overflow: hidden;
  transform: rotate(-1.2deg);
  transition: transform 0.5s var(--om-ease);
}
.om-term:hover { transform: rotate(0deg); }
.om-term__bar {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 18px;
  background: rgba(255, 158, 79, 0.08);
  border-bottom: 1px solid rgba(255, 158, 79, 0.16);
}
.om-term__dot { width: 12px; height: 12px; border-radius: 50%; }
.om-term__dot--r { background: #ff5f57; }
.om-term__dot--y { background: #febc2e; }
.om-term__dot--g { background: #28c840; }
.om-term__title {
  margin-left: auto; margin-right: auto;
  font-family: var(--om-font-mono); font-size: var(--om-fs-xs);
  color: rgba(255, 217, 184, 0.55);
}
.om-term__body {
  padding: 22px 24px 26px;
  font-family: var(--om-font-mono);
  font-size: clamp(0.72rem, 1.1vw, 0.84rem);
  line-height: 1.85;
  color: #ffd9b8;
  min-height: 320px;
  overflow: hidden;
}
.om-term__line { white-space: pre-wrap; word-break: break-all; }
.om-term__line--cmd { color: #ffffff; }
.om-term__line--cmd::before { content: "➜ "; color: var(--om-accent); font-weight: 700; }
.om-term__line--out { color: rgba(255, 217, 184, 0.82); }
.om-term__line--ok { color: #6fdc8f; }
.om-term__line--dim { color: rgba(255, 217, 184, 0.42); }
.om-term__cursor {
  display: inline-block; width: 9px; height: 1.1em;
  background: var(--om-accent); vertical-align: text-bottom;
  animation: om-blink 1s steps(1) infinite;
}
@keyframes om-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .om-term { transform: none; }
  .om-term__cursor { animation: none; }
}

.om-pagehero {
  position: relative; overflow: hidden;
  background: var(--om-grad-glow);
  padding: clamp(48px, 6vw, 80px) 0;
}
.om-pagehero::before {
  content: ""; position: absolute; inset: 0;
  background: var(--om-grad-dawn); pointer-events: none;
}
.om-pagehero__inner { position: relative; z-index: 1; max-width: 720px; }
.om-pagehero h1 { font-size: clamp(2rem, 4vw, var(--om-fs-3xl)); margin-top: var(--om-sp-3); }
.om-pagehero p { color: var(--om-ink-soft); font-size: var(--om-fs-md); margin-bottom: 0; }

.om-ctaband {
  position: relative; overflow: hidden;
  background: var(--om-grad-fire);
  border-radius: var(--om-r-xl);
  margin-inline: clamp(8px, 1.6vw, 24px);
  padding: clamp(48px, 6vw, 88px) 0;
  text-align: center; color: var(--om-white);
  box-shadow: var(--om-shadow-glow);
}
.om-ctaband::before {
  content: ""; position: absolute;
  width: 420px; height: 420px; left: -140px; bottom: -220px;
  background: rgba(255, 255, 255, 0.14);
  border-radius: 42% 58% 62% 38% / 46% 44% 56% 54%;
  transform: rotate(25deg); pointer-events: none;
}
.om-ctaband h2 { color: var(--om-white); }
.om-ctaband p { color: rgba(255, 255, 255, 0.9); max-width: 36em; margin-inline: auto; }
.om-ctaband .om-btn--secondary { border-color: transparent; }
.om-ctaband__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--om-sp-3); margin-top: var(--om-sp-6); }

.om-hero__scene {
  position: absolute;
  left: 34%;
  top: -120px;
  width: 500px;
  opacity: 0.5;
  pointer-events: none;
  z-index: 0;
}
.om-hero__scene img { width: 100%; height: auto; display: block; }
.om-hero__inner { position: relative; z-index: 1; }
@media (max-width: 1100px) { .om-hero__scene { width: 400px; left: 30%; top: -110px; opacity: 0.38; } }
@media (max-width: 760px) { .om-hero__scene { display: none; } }

.om-section--surface + .om-section--surface,
.om-section--surface + .om-section--dark,
.om-section--dark + .om-section--surface,
.om-section--dark + .om-section--dark,
.om-section--surface + .om-ctaband,
.om-section--dark + .om-ctaband,
.om-ctaband + .om-section--surface,
.om-ctaband + .om-section--dark { margin-top: clamp(20px, 3vw, 44px); }