/* Product visual */
.product-showcase {
  display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr);
  align-items: center; gap: clamp(32px,5vw,64px);
  border-radius: var(--radius-lg); background: #0d141a;
  padding: clamp(32px,5vw,56px); box-shadow: var(--shadow-dark);
}
.product-showcase-copy { color: #fff; }
.product-showcase-copy h2 { margin-bottom: 16px; font-size: clamp(2rem,3.8vw,3.5rem); }
.product-showcase-copy p { max-width: 540px; color: #b7c1c8; }
.product-showcase-image {
  width: 100%; border-radius: 12px; box-shadow: 0 24px 64px rgba(0,0,0,.32);
}

/* Capability cards */
.capability-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.capability-card {
  position: relative; min-height: 250px; overflow: hidden; border: 1px solid var(--line);
  border-radius: var(--radius); background: #fff; padding: 26px; box-shadow: var(--shadow-sm);
}
.capability-card::after {
  position: absolute; right: -60px; bottom: -70px; width: 160px; height: 160px;
  border-radius: 50%; background: radial-gradient(circle, rgba(245,158,11,.14), transparent 68%); content: "";
}
.icon-box {
  display: grid; width: 44px; height: 44px; margin-bottom: 30px; place-items: center;
  border-radius: 11px; background: var(--ink); color: var(--orange);
}
.icon-box::before {
  width: 16px; height: 16px; transform: rotate(45deg);
  border-top: 3px solid var(--orange); border-right: 3px solid var(--orange); content: "";
}
.capability-card h3 { margin-bottom: 10px; }
.capability-card p { color: var(--muted); font-size: 0.95rem; }
.capability-card .mini-link {
  position: absolute; bottom: 24px; left: 26px; color: #b36000;
  font-size: 0.86rem; font-weight: 720; text-decoration: none;
}

/* Workflow */
.workflow { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; counter-reset: workflow; }
.workflow-step {
  position: relative; min-height: 240px; border-top: 1px solid #34414a;
  padding: 34px 28px 0 0; counter-increment: workflow;
}
.workflow-step:not(:last-child)::after {
  position: absolute; top: -4px; right: 24px; width: 8px; height: 8px;
  transform: rotate(45deg); border-top: 1px solid #5a6872; border-right: 1px solid #5a6872; content: "";
}
.workflow-step::before {
  display: inline-grid; width: 36px; height: 36px; margin-bottom: 52px; place-items: center;
  border: 1px solid #3a4851; border-radius: 50%; background: #151f27; color: var(--orange);
  content: counter(workflow, decimal-leading-zero); font-size: 0.72rem; font-weight: 800;
}
.workflow-step h3 { margin-bottom: 10px; color: #fff; }
.workflow-step p { max-width: 235px; color: #9eabb4; font-size: 0.9rem; }

/* Use cases */
.use-case-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; }
.use-case {
  display: grid; grid-template-columns: 54px 1fr; gap: 20px;
  border: 1px solid var(--line); border-radius: var(--radius); background: #fff; padding: 26px;
}
.use-case .icon-box { margin-bottom: 0; width: 54px; height: 54px; border-radius: 14px; }
.use-case h3 { margin-bottom: 8px; }
.use-case p { color: var(--muted); font-size: .94rem; }

/* Trust callout */
.trust-band {
  position: relative; overflow: hidden; border-radius: var(--radius-lg);
  background: radial-gradient(circle at 88% 0%, rgba(245,158,11,.21), transparent 27%),
              linear-gradient(145deg, #101921, #071018);
  color: #fff; padding: clamp(38px,6vw,66px);
}
.trust-band::after {
  position: absolute; top: -190px; right: -160px; width: 430px; height: 430px;
  transform: rotate(36deg); border: 58px solid rgba(245,158,11,.08); content: "";
}
.trust-band-grid {
  position: relative; z-index: 2; display: grid; grid-template-columns: 1.1fr .9fr;
  align-items: center; gap: 60px;
}
.trust-band h2 { margin-bottom: 18px; font-size: clamp(2.1rem,4vw,3.8rem); }
.trust-band p { max-width: 620px; color: #b7c1c8; }
.trust-points { display: grid; gap: 13px; }
.trust-point { display: flex; align-items: flex-start; gap: 12px; color: #d8e0e5; font-size: .94rem; }
.trust-point::before {
  flex: 0 0 8px; width: 8px; height: 8px; margin-top: 8px;
  border-radius: 50%; background: var(--orange); content: "";
}

/* CTA */
.cta-section { position: relative; overflow: hidden; background: var(--orange); color: var(--ink); }
.cta-section::after {
  position: absolute; top: -155px; right: 5vw; width: 420px; height: 420px;
  transform: rotate(42deg); border: 72px solid rgba(13,20,26,.11); content: "";
}
.cta-inner {
  position: relative; z-index: 2; display: grid; grid-template-columns: 1.1fr auto;
  align-items: center; gap: 44px;
}
.cta-inner h2 { max-width: 770px; margin-bottom: 14px; font-size: clamp(2.2rem,4.5vw,4.5rem); }
.cta-inner p { max-width: 650px; margin-bottom: 0; color: #4b3210; font-size: 1.05rem; }
.cta-actions { display: flex; flex-direction: column; gap: 10px; }
.cta-section .button-dark { box-shadow: 0 14px 38px rgba(13,20,26,.18); }
.cta-section .button-outline { border-color: rgba(13,20,26,.3); }

/* Page hero */
.page-hero {
  position: relative; min-height: 580px; overflow: hidden;
  background: radial-gradient(circle at 84% 23%, rgba(245,158,11,.16), transparent 30%),
              linear-gradient(135deg, #071018, #111b23 68%, #1c252b);
  color: #fff;
}
.page-hero::after {
  position: absolute; top: -310px; right: -160px; width: 760px; height: 760px;
  transform: rotate(41deg); border: 105px solid rgba(245,158,11,.08); content: "";
}
.page-hero-inner {
  position: relative; z-index: 3; display: grid; min-height: 580px; align-items: end;
  padding-top: calc(var(--header-height) + 60px); padding-bottom: 78px;
}
.page-hero-copy { max-width: 920px; }
.page-hero h1 { max-width: 1000px; margin-bottom: 22px; font-size: clamp(3rem,6.5vw,6rem); }
.page-hero .lede { max-width: 760px; margin-bottom: 0; }
.page-hero-compact { min-height: 470px; }
.page-hero-compact .page-hero-inner { min-height: 470px; padding-bottom: 64px; }
