.elementor-145 .elementor-element.elementor-element-689b166{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-145 .elementor-element.elementor-element-4b9638f{margin:-25px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}@media(min-width:768px){.elementor-145 .elementor-element.elementor-element-689b166{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-4b9638f *//* 1) Full-width breakout (removes left/right gap) */
.ocw-page {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
}

/* Keep content centered */
.ocw-wrap {
  width: min(1180px, 94%);
  margin: 0 auto;
}

/* 2) Hero card: rounded + fade border */
.ocw-hero-center {
  position: relative;
  border-radius: 24px;
  padding: 56px 20px 30px;
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  overflow: hidden;
}

/* Fade border glow */
.ocw-hero-center::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  padding: 1.2px;
  background: linear-gradient(
    130deg,
    rgba(22,104,208,0.0) 0%,
    rgba(22,104,208,0.65) 25%,
    rgba(245,166,35,0.65) 65%,
    rgba(245,166,35,0.0) 100%
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  opacity: .95;
}

/* optional softer outer glow */
.ocw-hero-center::after {
  content: "";
  position: absolute;
  inset: -30px;
  border-radius: 34px;
  background: radial-gradient(circle at 20% 20%, rgba(22,104,208,.16), transparent 40%),
              radial-gradient(circle at 80% 60%, rgba(245,166,35,.14), transparent 42%);
  filter: blur(18px);
  z-index: 0;
  pointer-events: none;
}
.ocw-hero-center > * {
  position: relative;
  z-index: 1;
}

/* Mobile safe width */
@media (max-width: 768px) {
  .ocw-wrap { width: 92%; }
  .ocw-hero-center { border-radius: 18px; padding: 42px 14px 22px; }
}
/* OpenClaw page */
.ocw-page{
  --ocw-primary:#1668D0;
  --ocw-accent:#F5A623;
  --ocw-dark:#0b1020;
  --ocw-text:#eef3ff;
  --ocw-muted:#aab7d6;
  --ocw-card:#131a2e;
  background:#070b17;
  color:var(--ocw-text);
  padding:56px 0 70px;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
.ocw-page *{box-sizing:border-box}
.ocw-wrap{width:min(1160px,94%);margin:0 auto}

/* Hero */
.ocw-hero{
  display:grid;
  grid-template-columns:1.08fr 1fr;
  gap:28px;
  align-items:center;
}
.ocw-tag{
  display:inline-block;
  margin:0 0 12px;
  padding:6px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:rgba(22,104,208,.18);
  border:1px solid rgba(22,104,208,.45);
}
.ocw-copy h1{
  margin:0;
  font-size:clamp(34px,5vw,58px);
  line-height:1.05;
  letter-spacing:-.02em;
}
.ocw-copy p{color:var(--ocw-muted);max-width:48rem}
.ocw-cta{
  margin-top:18px;
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.ocw-btn{
  display:inline-block;
  text-decoration:none;
  padding:12px 20px;
  border-radius:10px;
  font-weight:900;
}
.ocw-btn-primary{
  color:#fff;
  background:var(--ocw-primary);
}
.ocw-price span{display:block;font-size:12px;color:var(--ocw-muted)}
.ocw-price strong{font-size:42px;line-height:1;color:#fff}
.ocw-points{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.ocw-points span{
  text-align:center;
  padding:10px 8px;
  border-radius:10px;
  font-size:13px;
  color:#c9d5ef;
  border:1px solid #222c49;
  background:#0f1528;
}

/* macOS animation */
.ocw-window{
  background:#fff;
  color:#20263a;
  border-radius:16px;
  overflow:hidden;
  border:1px solid #dbe4f6;
  box-shadow:0 20px 42px rgba(8,13,30,.38);
  animation:ocwFloat 4.8s ease-in-out infinite;
}
.ocw-topbar{
  height:44px;
  background:#f2f6ff;
  border-bottom:1px solid #e2e9f7;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 12px;
}
.ocw-topbar .dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.ocw-topbar .red{background:#ff5f57}
.ocw-topbar .yellow{background:#febc2e}
.ocw-topbar .green{background:#28c840}
.ocw-topbar .title{margin-left:8px;font-size:13px;font-weight:700;color:#4c5673}
.ocw-body{padding:16px}
.ocw-tabs{display:flex;gap:8px;margin-bottom:10px}
.ocw-tabs span{
  font-size:12px;font-weight:700;
  padding:6px 10px;border-radius:999px;
  background:#eef2fb;color:#425178;
}
.ocw-tabs .active{
  background:var(--ocw-primary);
  color:#fff;
}
.ocw-body label{font-size:12px;color:#5d6888}
.ocw-input{
  margin:6px 0 12px;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid #dce3f2;
  background:#fafcff;
  font-size:12px;
}
.ocw-steps .step{
  font-size:12px;
  padding:8px 10px;
  border-radius:8px;
  margin-bottom:6px;
  background:#f4f7fd;
}
.ocw-steps .done{border-left:4px solid #1fb26b}
.ocw-steps .live{
  border-left:4px solid var(--ocw-accent);
  animation:ocwPulse 1.4s ease-in-out infinite;
}
.ocw-progress{
  height:10px;border-radius:999px;
  background:#e9eef9;overflow:hidden;margin:10px 0 12px;
}
.ocw-progress .bar{
  height:100%;width:28%;
  background:var(--ocw-primary);
  animation:ocwProgress 3s ease-in-out infinite;
}
.ocw-btn-mini{
  border:0;border-radius:8px;
  background:#151b2d;color:#fff;
  padding:9px 14px;font-weight:800;
}

/* Why section */
.ocw-why{
  margin-top:46px;
  padding:28px;
  border-radius:18px;
  background:linear-gradient(145deg,#24064b 0%, #170a3e 55%, #0f1430 100%);
  border:1px solid rgba(255,255,255,.08);
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:20px;
}
.ocw-why-left h2{margin:0 0 8px;font-size:42px;line-height:1.1}
.ocw-why-left p{color:#c8b8ec}
.ocw-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}
.ocw-grid article{
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  padding:14px;
  background:rgba(255,255,255,.03);
}
.ocw-grid h3{margin:0 0 4px;font-size:16px}
.ocw-grid p{margin:0;color:#c9c5e6;font-size:13px;line-height:1.45}

/* Plans */
.ocw-plans{margin-top:44px}
.ocw-plans h2{
  margin:0 0 14px;
  font-size:clamp(26px,3vw,38px);
}
.ocw-plan-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.ocw-plan-grid .plan{
  background:#ffffff;
  border:1px solid #dde5f4;
  border-radius:14px;
  padding:16px;
  color:#1b2237;
}
.ocw-plan-grid .plan.featured{
  border:2px solid var(--ocw-primary);
  box-shadow:0 12px 28px rgba(22,104,208,.22);
}
.ocw-plan-grid h3{margin:0 0 6px}
.ocw-plan-grid .price{
  margin:0 0 8px;
  font-size:36px;
  font-weight:900;
}
.ocw-plan-grid .price span{
  font-size:14px;
  font-weight:700;
  color:#5f6a85;
  margin-left:4px;
}
.ocw-plan-grid ul{
  margin:0 0 12px;
  padding-left:18px;
  color:#4c5670;
}
.ocw-order{
  display:block;
  text-align:center;
  text-decoration:none;
  font-weight:900;
  color:#fff;
  background:var(--ocw-primary);
  border-radius:10px;
  padding:11px 14px;
}

/* Animations */
@keyframes ocwProgress{
  0%{width:22%}
  50%{width:92%}
  100%{width:22%}
}
@keyframes ocwPulse{
  0%,100%{opacity:.75}
  50%{opacity:1}
}
@keyframes ocwFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

/* Responsive */
@media (max-width:980px){
  .ocw-hero,.ocw-why,.ocw-plan-grid,.ocw-grid{grid-template-columns:1fr}
  .ocw-points{grid-template-columns:1fr 1fr}
  .ocw-why-left h2{font-size:34px}
}
.ocw-hero-center {
  display: block;
  text-align: center;
  position: relative;
  padding: 44px 12px 20px;
  overflow: hidden;
}

.ocw-hero-center .ocw-copy {
  max-width: 860px;
  margin: 0 auto;
}

.ocw-hero-center .ocw-tag { margin-left: auto; margin-right: auto; }
.ocw-hero-center .ocw-copy p { margin-left: auto; margin-right: auto; }
.ocw-hero-center .ocw-cta { justify-content: center; }
.ocw-hero-center .ocw-points { max-width: 900px; margin: 18px auto 0; }

.ocw-mac { display: none !important; }

.ocw-hero-center::before,
.ocw-hero-center::after {
  content: "";
  position: absolute;
  inset: -20% -10%;
  pointer-events: none;
}

.ocw-hero-center::before {
  background-image:
    radial-gradient(circle, rgba(245,166,35,.85) 1.1px, transparent 1.2px),
    radial-gradient(circle, rgba(22,104,208,.85) 1px, transparent 1.1px),
    radial-gradient(circle, rgba(255,255,255,.55) 1px, transparent 1.1px);
  background-size: 140px 140px, 190px 190px, 110px 110px;
  background-position: 0 0, 40px 70px, 90px 20px;
  opacity: .42;
  animation: ocwStarsDrift 28s linear infinite;
}

.ocw-hero-center::after {
  background:
    radial-gradient(circle at 20% 30%, rgba(245,166,35,.20), transparent 28%),
    radial-gradient(circle at 80% 20%, rgba(22,104,208,.22), transparent 30%),
    radial-gradient(circle at 50% 75%, rgba(245,166,35,.15), transparent 35%);
  filter: blur(8px);
  opacity: .9;
  animation: ocwNebulaPulse 6s ease-in-out infinite;
}

@keyframes ocwStarsDrift {
  from { transform: translateY(0); }
  to { transform: translateY(60px); }
}

@keyframes ocwNebulaPulse {
  0%, 100% { opacity: .55; transform: scale(1); }
  50% { opacity: .95; transform: scale(1.04); }
}
.ocw-cta { justify-content: center; }
.ocw-price { text-align: center; }
/* More space under header */
.ocw-page {
  padding-top: 96px;   /* increase if needed */
}

/* extra space for hero only */
.ocw-hero-center {
  padding-top: 70px;
}


/* End custom CSS */