/* Premium finish layer: high-trust demo framing, image hygiene, and interaction boundaries. */

.card-visual,
.generated-photo-card,
.generated-asset-placeholder,
.visual-card {
  isolation: isolate;
  overflow: hidden;
  overflow: clip;
  contain: paint;
  background-clip: padding-box;
  transform-style: preserve-3d;
}

.card-visual::before,
.card-visual::after,
.generated-photo-card::after,
.generated-asset-placeholder::after,
.visual-card::after {
  border-radius: inherit;
  pointer-events: none;
}

.generated-photo-card img,
.generated-asset-placeholder img,
.visual-card img {
  display: block;
  border-radius: inherit;
  transform: scale(1.012) translateZ(0);
  backface-visibility: hidden;
}

.generated-photo-card,
.generated-asset-placeholder {
  outline: 1px solid rgba(255, 255, 255, 0.36);
  outline-offset: -1px;
}

.card-visual {
  border-color: rgba(255, 255, 255, 0.34);
}

.button,
.site-nav a,
.filter-button,
.text-link {
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease;
}

.button:hover,
.button:focus-visible,
.filter-button:hover,
.filter-button:focus-visible {
  transform: translateY(-2px);
}

.button.primary,
.nav-cta {
  box-shadow: 0 14px 34px rgba(16, 32, 39, 0.14);
}

.button.primary:hover,
.button.primary:focus-visible,
.nav-cta:hover,
.nav-cta:focus-visible {
  box-shadow: 0 18px 44px rgba(16, 32, 39, 0.2);
}

.nav-cta[href^="mailto:"],
.button.primary[href^="mailto:"],
.button.secondary[href^="mailto:"],
.card-actions .text-link[href^="mailto:"] {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #ffffff !important;
  background:
    linear-gradient(135deg, var(--order-cta-from) 0%, var(--order-cta-mid) 44%, var(--order-cta-to) 100%) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  box-shadow:
    0 18px 46px var(--order-cta-shadow-a),
    0 9px 22px var(--order-cta-shadow-b),
    0 0 0 1px rgba(255, 255, 255, 0.36) inset !important;
  text-shadow: 0 1px 1px rgba(2, 8, 18, 0.28);
}

.card-actions .text-link[href^="mailto:"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.68rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  text-decoration: none;
}

.standalone-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 0.68rem 0.95rem;
  border: 1px solid rgba(16, 32, 39, 0.14);
  border-radius: 999px;
  color: #102027 !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.58)),
    linear-gradient(135deg, rgba(134, 208, 182, 0.34), rgba(217, 168, 94, 0.28));
  box-shadow: 0 12px 30px rgba(16, 32, 39, 0.1);
  text-decoration: none;
}

.standalone-link::after {
  content: "Open";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.45rem;
  margin-left: 0.65rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  color: #ffffff;
  background: #102027;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.standalone-link:hover,
.standalone-link:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(16, 32, 39, 0.24);
  box-shadow: 0 18px 44px rgba(16, 32, 39, 0.16);
}

.nav-cta[href^="mailto:"]:hover,
.nav-cta[href^="mailto:"]:focus-visible,
.button.primary[href^="mailto:"]:hover,
.button.primary[href^="mailto:"]:focus-visible,
.button.secondary[href^="mailto:"]:hover,
.button.secondary[href^="mailto:"]:focus-visible,
.card-actions .text-link[href^="mailto:"]:hover,
.card-actions .text-link[href^="mailto:"]:focus-visible {
  transform: translateY(-2px);
  background:
    linear-gradient(135deg, var(--order-cta-hover-from) 0%, var(--order-cta-hover-mid) 44%, var(--order-cta-hover-to) 100%) !important;
  box-shadow:
    0 22px 58px var(--order-cta-shadow-a),
    0 10px 26px var(--order-cta-shadow-b),
    0 0 0 1px rgba(255, 255, 255, 0.44) inset !important;
}

body {
  --order-cta-from: #0d4c3d;
  --order-cta-mid: #159163;
  --order-cta-to: #4fc878;
  --order-cta-hover-from: #083d31;
  --order-cta-hover-mid: #0fa36a;
  --order-cta-hover-to: #73df96;
  --order-cta-shadow-a: rgba(15, 145, 99, 0.26);
  --order-cta-shadow-b: rgba(79, 200, 120, 0.22);
  text-rendering: geometricPrecision;
}

.ai-card,
#ai-support-assistant {
  --order-cta-from: #0d5a49;
  --order-cta-mid: #158a72;
  --order-cta-to: #dc6f58;
  --order-cta-hover-from: #106b57;
  --order-cta-hover-mid: #18a486;
  --order-cta-hover-to: #ef8068;
  --order-cta-shadow-a: rgba(13, 90, 73, 0.26);
  --order-cta-shadow-b: rgba(220, 111, 88, 0.24);
}

.saas-card,
#saas-dashboard {
  --order-cta-from: #2437ff;
  --order-cta-mid: #1688ff;
  --order-cta-to: #00bda5;
  --order-cta-hover-from: #334bff;
  --order-cta-hover-mid: #22a1ff;
  --order-cta-hover-to: #18d4bd;
  --order-cta-shadow-a: rgba(36, 55, 255, 0.26);
  --order-cta-shadow-b: rgba(0, 189, 165, 0.24);
}

.landing-card,
#landing-crm {
  --order-cta-from: #f97316;
  --order-cta-mid: #ef4444;
  --order-cta-to: #c026d3;
  --order-cta-hover-from: #fb8a2d;
  --order-cta-hover-mid: #f45b5b;
  --order-cta-hover-to: #d946ef;
  --order-cta-shadow-a: rgba(249, 115, 22, 0.25);
  --order-cta-shadow-b: rgba(192, 38, 211, 0.22);
}

.rescue-card,
#app-rescue {
  --order-cta-from: #111827;
  --order-cta-mid: #b91c1c;
  --order-cta-to: #f97316;
  --order-cta-hover-from: #1f2937;
  --order-cta-hover-mid: #dc2626;
  --order-cta-hover-to: #fb923c;
  --order-cta-shadow-a: rgba(17, 24, 39, 0.25);
  --order-cta-shadow-b: rgba(220, 38, 38, 0.24);
}

.booking-card {
  --order-cta-from: #2f6f4e;
  --order-cta-mid: #72a06f;
  --order-cta-to: #d4a373;
  --order-cta-hover-from: #367d58;
  --order-cta-hover-mid: #84b87d;
  --order-cta-hover-to: #e2b987;
  --order-cta-shadow-a: rgba(47, 111, 78, 0.24);
  --order-cta-shadow-b: rgba(212, 163, 115, 0.22);
}

.parser-card {
  --order-cta-from: #155e75;
  --order-cta-mid: #2563eb;
  --order-cta-to: #7c3aed;
  --order-cta-hover-from: #0e7490;
  --order-cta-hover-mid: #3b82f6;
  --order-cta-hover-to: #8b5cf6;
  --order-cta-shadow-a: rgba(37, 99, 235, 0.24);
  --order-cta-shadow-b: rgba(124, 58, 237, 0.2);
}

.mobile-card {
  --order-cta-from: #ff5e7e;
  --order-cta-mid: #7c3aed;
  --order-cta-to: #111827;
  --order-cta-hover-from: #ff7792;
  --order-cta-hover-mid: #8b5cf6;
  --order-cta-hover-to: #273449;
  --order-cta-shadow-a: rgba(255, 94, 126, 0.22);
  --order-cta-shadow-b: rgba(124, 58, 237, 0.22);
}

.edtech-card {
  --order-cta-from: #ffb703;
  --order-cta-mid: #f72585;
  --order-cta-to: #5b21b6;
  --order-cta-hover-from: #ffc533;
  --order-cta-hover-mid: #ff4aa2;
  --order-cta-hover-to: #6d28d9;
  --order-cta-shadow-a: rgba(247, 37, 133, 0.22);
  --order-cta-shadow-b: rgba(91, 33, 182, 0.2);
}

h1,
h2 {
  text-wrap: balance;
}

.demo-stage {
  --stage-deep: #08151b;
  --stage-mid: #102027;
  --stage-accent: #86d0b6;
  --stage-warm: #bf7b16;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 255, 255, 0.96), transparent 22rem),
    radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--stage-accent) 34%, transparent), transparent 30rem),
    linear-gradient(180deg, var(--stage-deep) 0, var(--stage-mid) 760px, #eff6f2 760px, #ffffff 100%);
  border-top: 1px solid rgba(16, 32, 39, 0.12);
  border-bottom: 1px solid rgba(16, 32, 39, 0.1);
  padding-bottom: clamp(92px, 10vw, 128px);
}

.demo-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 760px;
  z-index: -1;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--stage-accent) 28%, transparent), transparent 36%, color-mix(in srgb, var(--stage-warm) 18%, transparent)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 72px);
  mask-image: linear-gradient(180deg, #000 0%, transparent 100%);
}

.demo-stage::after {
  content: "LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO";
  position: absolute;
  right: clamp(18px, 4vw, 56px);
  bottom: 24px;
  left: clamp(18px, 4vw, 56px);
  z-index: 0;
  display: block;
  padding: 9px 0;
  overflow: hidden;
  color: color-mix(in srgb, var(--stage-accent) 78%, #ffffff);
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.32), transparent) top / 100% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16), transparent) bottom / 100% 1px no-repeat;
  font-size: clamp(0.68rem, 1.1vw, 0.82rem);
  font-weight: 950;
  letter-spacing: 0.12em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0.86;
}

.demo-stage-ribbon {
  position: relative;
  display: block;
  max-width: 1180px;
  margin: 0 auto clamp(30px, 4vw, 48px);
  padding: 10px 0;
  overflow: hidden;
  color: color-mix(in srgb, var(--stage-accent) 82%, #ffffff);
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.38), transparent) top / 100% 1px no-repeat,
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent) bottom / 100% 1px no-repeat;
  font-size: clamp(0.68rem, 1.1vw, 0.82rem);
  font-weight: 950;
  letter-spacing: 0.12em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.demo-stage-ribbon > * {
  display: none !important;
}

.demo-stage-ribbon::before {
  content: "LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO / DEMO / LIVE DEMO";
  display: block;
  animation: premiumBoundaryDrift 18s linear infinite;
}

.demo-stage .section-heading {
  position: relative;
  max-width: 960px;
  margin-bottom: clamp(24px, 4vw, 40px);
  padding: clamp(18px, 3vw, 28px);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 18px;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.16);
  backdrop-filter: blur(18px);
}

.demo-stage .section-heading .eyebrow {
  color: var(--stage-accent);
}

.demo-stage .section-heading h2,
.demo-stage .section-heading p {
  color: inherit;
}

.demo-stage .section-heading p:not(.eyebrow) {
  color: rgba(255, 255, 255, 0.74);
}

.demo-interaction-map {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 1180px;
  margin: -14px auto clamp(22px, 4vw, 36px);
}

.demo-interaction-map button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 8px 11px;
  color: #173a31;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid color-mix(in srgb, var(--stage-accent) 38%, transparent);
  border-radius: 999px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.1);
  font-size: 0.78rem;
  font-weight: 900;
  cursor: pointer;
}

.demo-interaction-map button::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--stage-accent);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--stage-accent) 18%, transparent);
}

.demo-interaction-map button:hover,
.demo-interaction-map button:focus-visible {
  transform: translateY(-2px);
  color: #08151b;
  background: #ffffff;
}

.demo-stage .assistant-workbench,
.demo-stage .conversion-workbench,
.demo-stage .booking-workbench,
.demo-stage .parser-workbench,
.demo-stage .mobile-workbench,
.demo-stage .learning-workbench,
.demo-stage .login-layout,
.demo-stage .before-after-card {
  position: relative;
  z-index: 1;
  padding: clamp(12px, 2vw, 18px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 251, 250, 0.9)),
    rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.86);
  border-radius: 22px;
  box-shadow: 0 34px 100px rgba(5, 18, 24, 0.22);
}

.demo-stage .dashboard-shell-live {
  box-shadow: 0 34px 100px rgba(5, 18, 24, 0.18);
}

.demo-stage .chat-panel,
.demo-stage .settings-card,
.demo-stage .crm-card,
.demo-stage .campaign-page,
.demo-stage .conversion-panel > section,
.demo-stage .booking-flow-card,
.demo-stage .booking-side-panel > div,
.demo-stage .upload-panel,
.demo-stage .extraction-panel,
.demo-stage .parser-side > div,
.demo-stage .prototype-panel,
.demo-stage .roadmap-panel,
.demo-stage .task-panel,
.demo-stage .state-panel,
.demo-stage .audit-card,
.demo-stage .roadmap-card,
.demo-stage .bug-board-card,
.demo-stage .handoff-card {
  border-radius: 14px;
}

.demo-stage [id],
.demo-stage button,
.demo-stage input,
.demo-stage select,
.demo-stage textarea,
.demo-stage .quick-prompts button,
.demo-stage .filter-button,
.demo-stage .mode-button,
.demo-stage .service-card,
.demo-stage .service-button,
.demo-stage .slot-button,
.demo-stage .sample-button,
.demo-stage .status-filter,
.demo-stage .period-toggle button,
.demo-stage .answer-button {
  scroll-margin-top: 92px;
}

.demo-stage button,
.demo-stage input,
.demo-stage select,
.demo-stage textarea {
  border-color: color-mix(in srgb, var(--stage-accent) 25%, rgba(16, 32, 39, 0.14));
}

.demo-stage button {
  cursor: pointer;
}

.demo-stage input:focus,
.demo-stage select:focus,
.demo-stage textarea:focus,
.demo-stage button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--stage-accent) 30%, transparent);
  outline-offset: 2px;
}

.demo-stage .quick-prompts button,
.demo-stage .status-filters button,
.demo-stage .period-toggle button,
.demo-stage .service-card,
.demo-stage .service-button,
.demo-stage .slot-button,
.demo-stage .answer-button,
.demo-stage .path-node,
.demo-stage .sample-list button,
.demo-stage #sampleSearch,
.demo-stage #useDemoLogin,
.demo-stage #processButton,
.demo-stage #approveButton,
.demo-stage #exportButton,
.demo-stage #completeAction {
  box-shadow: 0 10px 24px rgba(5, 18, 24, 0.08);
}

.demo-stage .quick-prompts button:hover,
.demo-stage .status-filters button:hover,
.demo-stage .period-toggle button:hover,
.demo-stage .service-card:hover,
.demo-stage .service-button:hover,
.demo-stage .slot-button:hover,
.demo-stage .answer-button:hover,
.demo-stage .path-node:hover,
.demo-stage .sample-list button:hover,
.demo-stage #sampleSearch:hover,
.demo-stage #useDemoLogin:hover,
.demo-stage #processButton:hover,
.demo-stage #approveButton:hover,
.demo-stage #exportButton:hover,
.demo-stage #completeAction:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--stage-accent) 46%, rgba(16, 32, 39, 0.16));
}

.demo-target-pulse {
  animation: demoTargetPulse 1.55s ease both;
}

@keyframes premiumLivePulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 7px color-mix(in srgb, var(--stage-accent) 20%, transparent), 0 0 24px color-mix(in srgb, var(--stage-accent) 54%, transparent);
  }
  50% {
    transform: scale(1.16);
    box-shadow: 0 0 0 12px color-mix(in srgb, var(--stage-accent) 8%, transparent), 0 0 34px color-mix(in srgb, var(--stage-accent) 66%, transparent);
  }
}

@keyframes premiumBoundaryDrift {
  from {
    transform: translateX(-2%);
  }
  to {
    transform: translateX(2%);
  }
}

@keyframes demoTargetPulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--stage-accent, #86d0b6) 0%, transparent);
  }
  24% {
    box-shadow: 0 0 0 7px color-mix(in srgb, var(--stage-accent, #86d0b6) 22%, transparent);
  }
  100% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--stage-accent, #86d0b6) 0%, transparent);
  }
}

#chat-demo {
  --stage-deep: #06211f;
  --stage-mid: #123b35;
  --stage-accent: #86d0b6;
  --stage-warm: #d7aa69;
}

#login-mock,
#dashboard-preview {
  --stage-deep: #071225;
  --stage-mid: #132f64;
  --stage-accent: #82b7ff;
  --stage-warm: #8ee2d1;
}

#campaign-preview {
  --stage-deep: #21140f;
  --stage-mid: #6d3221;
  --stage-accent: #ffb16d;
  --stage-warm: #ff6d4a;
}

#rescue-workbench {
  --stage-deep: #120f14;
  --stage-mid: #4b1d28;
  --stage-accent: #ff716d;
  --stage-warm: #9de0c3;
}

#booking-workbench {
  --stage-deep: #13221b;
  --stage-mid: #3d6d50;
  --stage-accent: #b9d9a8;
  --stage-warm: #d9b47f;
}

#parser-workbench {
  --stage-deep: #081724;
  --stage-mid: #174a9b;
  --stage-accent: #68d6e7;
  --stage-warm: #8fb6ff;
}

#mobile-workbench {
  --stage-deep: #17132b;
  --stage-mid: #5d46c6;
  --stage-accent: #ffb2a5;
  --stage-warm: #7fe2c4;
}

#learning-workbench {
  --stage-deep: #251b47;
  --stage-mid: #703c9f;
  --stage-accent: #ffd36e;
  --stage-warm: #ff78a8;
}

.assistant-hero,
.dashboard-hero,
.landing-hero,
.rescue-hero,
.booking-hero,
.parser-hero,
.mobile-hero,
.edtech-hero {
  position: relative;
  overflow: hidden;
}

.assistant-hero::before,
.dashboard-hero::before,
.landing-hero::before,
.rescue-hero::before,
.booking-hero::before,
.parser-hero::before,
.mobile-hero::before,
.edtech-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.assistant-hero > *,
.dashboard-hero > *,
.landing-hero > *,
.rescue-hero > *,
.booking-hero > *,
.parser-hero > *,
.mobile-hero > *,
.edtech-hero > * {
  position: relative;
  z-index: 1;
}

.assistant-hero {
  background:
    radial-gradient(circle at 78% 18%, rgba(134, 208, 182, 0.24), transparent 34rem),
    linear-gradient(135deg, #fbfffd 0%, #eef8f4 58%, #ffffff 100%);
}

.assistant-hero::before {
  background:
    linear-gradient(90deg, rgba(23, 107, 82, 0.04) 1px, transparent 1px),
    linear-gradient(180deg, rgba(23, 107, 82, 0.04) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(circle at 74% 26%, #000 0%, transparent 58%);
}

.dashboard-hero {
  color: #ffffff;
  background:
    radial-gradient(circle at 78% 20%, rgba(130, 183, 255, 0.36), transparent 30rem),
    radial-gradient(circle at 30% 92%, rgba(142, 226, 209, 0.18), transparent 24rem),
    linear-gradient(135deg, #06101f 0%, #0d2248 52%, #091422 100%);
}

.dashboard-hero::before {
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.065) 0 1px, transparent 1px 74px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 74px);
  mask-image: linear-gradient(120deg, #000 0%, transparent 74%);
}

.dashboard-hero h1,
.dashboard-hero .dashboard-subtitle,
.dashboard-hero .panel-kicker,
.dashboard-hero .mini-metrics span,
.dashboard-hero .mini-dashboard-top h2 {
  color: inherit;
}

.dashboard-hero .dashboard-subtitle,
.dashboard-hero .mini-metrics span {
  color: rgba(255, 255, 255, 0.72);
}

.dashboard-hero .label-row span,
.dashboard-hero .status-pill {
  color: #dcecff;
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(130, 183, 255, 0.26);
}

.dashboard-hero .hero-dashboard-card {
  background: rgba(8, 18, 35, 0.74);
  border-color: rgba(130, 183, 255, 0.24);
}

.dashboard-hero .mini-metrics div {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(130, 183, 255, 0.18);
}

.dashboard-hero .mini-metrics strong {
  color: #ffffff;
}

.landing-hero {
  background:
    radial-gradient(circle at 78% 20%, rgba(255, 177, 109, 0.3), transparent 30rem),
    linear-gradient(135deg, #fff8f0 0%, #ffe2c3 50%, #fffaf4 100%);
}

.landing-hero::before {
  background:
    linear-gradient(135deg, transparent 0 46%, rgba(223, 109, 69, 0.08) 46% 47%, transparent 47% 100%),
    radial-gradient(circle at 86% 18%, rgba(52, 37, 29, 0.08), transparent 18rem);
}

.rescue-hero {
  color: #ffffff;
  background:
    radial-gradient(circle at 76% 16%, rgba(255, 113, 109, 0.28), transparent 28rem),
    radial-gradient(circle at 20% 92%, rgba(157, 224, 195, 0.14), transparent 24rem),
    linear-gradient(135deg, #0c0f14 0%, #2b141b 48%, #111820 100%);
}

.rescue-hero::before {
  background:
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 22px),
    linear-gradient(90deg, rgba(255, 113, 109, 0.08), transparent 36%, rgba(157, 224, 195, 0.06));
}

.rescue-hero h1,
.rescue-hero .rescue-subtitle,
.rescue-hero .panel-kicker,
.rescue-hero .hero-card-top h2,
.rescue-hero .risk-stack span {
  color: inherit;
}

.rescue-hero .rescue-subtitle,
.rescue-hero .risk-stack span {
  color: rgba(255, 255, 255, 0.72);
}

.rescue-hero .label-row span {
  color: #ffe1df;
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 113, 109, 0.24);
}

.rescue-hero .hero-rescue-card {
  background: rgba(13, 18, 24, 0.78);
  border-color: rgba(255, 113, 109, 0.22);
}

.rescue-hero .risk-stack div {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 113, 109, 0.18);
}

.rescue-hero .risk-stack strong {
  color: #ffffff;
}

.booking-hero {
  background:
    radial-gradient(circle at 78% 16%, rgba(185, 217, 168, 0.34), transparent 31rem),
    linear-gradient(135deg, #fffaf0 0%, #eef7e9 54%, #ffffff 100%);
}

.parser-hero {
  background:
    radial-gradient(circle at 80% 16%, rgba(104, 214, 231, 0.28), transparent 31rem),
    linear-gradient(135deg, #f7fbff 0%, #e8f4ff 48%, #ffffff 100%);
}

.mobile-hero {
  background:
    radial-gradient(circle at 80% 14%, rgba(255, 178, 165, 0.32), transparent 31rem),
    radial-gradient(circle at 20% 84%, rgba(127, 226, 196, 0.2), transparent 24rem),
    linear-gradient(135deg, #fff8f6 0%, #f1edff 54%, #ffffff 100%);
}

.edtech-hero {
  background:
    radial-gradient(circle at 80% 18%, rgba(255, 211, 110, 0.36), transparent 30rem),
    radial-gradient(circle at 18% 86%, rgba(255, 120, 168, 0.18), transparent 24rem),
    linear-gradient(135deg, #fff8df 0%, #f3edff 54%, #ffffff 100%);
}

.assistant-snapshot,
.hero-dashboard-card,
.hero-system-card,
.hero-rescue-card,
.studio-preview,
.parser-visual,
.phone-stage,
.learning-visual {
  filter: drop-shadow(0 34px 80px rgba(5, 18, 24, 0.14));
}

.generated-photo-card,
.generated-asset-placeholder,
.visual-card {
  border-radius: 24px !important;
}

@media (max-width: 860px) {
  .demo-stage {
    background:
      linear-gradient(180deg, var(--stage-deep) 0, var(--stage-mid) 540px, #eff6f2 540px, #ffffff 100%);
  }

  .demo-stage .section-heading {
    border-radius: 16px;
  }
}

@media (max-width: 640px) {
  .demo-stage .assistant-workbench,
  .demo-stage .conversion-workbench,
  .demo-stage .booking-workbench,
  .demo-stage .parser-workbench,
  .demo-stage .mobile-workbench,
  .demo-stage .learning-workbench,
  .demo-stage .login-layout,
  .demo-stage .before-after-card {
    padding: 10px;
    border-radius: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .demo-stage-ribbon .live-dot {
    animation: none !important;
  }

  .demo-stage-ribbon::before {
    animation: none !important;
  }

  .demo-target-pulse {
    animation: none !important;
  }
}
