/* Homepage: Hub & Lab (page 8377). The {C} Hub look: dark slate, pink-orange glow, pixel grid. Scoped to this page. */
.page-id-8377 { background: #131b22; }
.page-id-8377 .cdh-band { position: relative; overflow: hidden; background-color: #131b22; isolation: isolate; }
.page-id-8377 .cdh-band-alt { background-color: #1a232b; border-top: 1px solid rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.05); }
.page-id-8377 .cdh-band-lab { background-color: #0f161c; border-top: 1px solid rgba(255,23,107,.35); }

/* Pixel effect: the dotted grid from the Lab and Hub screens */
.page-id-8377 .cdh-pixel::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.2px);
  background-size: 18px 18px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 80%);
          mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 80%);
}
/* Aurora: the soft pink and orange glow behind the Hub's headers */
.page-id-8377 .cdh-aurora::after {
  content: ""; position: absolute; inset: -20% -10%; z-index: -2; pointer-events: none;
  background:
    radial-gradient(40% 45% at 15% 20%, rgba(255,23,107,.22), transparent 70%),
    radial-gradient(35% 40% at 85% 30%, rgba(255,138,0,.16), transparent 70%),
    radial-gradient(45% 40% at 60% 100%, rgba(255,91,35,.12), transparent 70%);
  filter: blur(30px);
  animation: cdh-drift 18s ease-in-out infinite alternate;
}
@keyframes cdh-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(3%, -2%, 0); } }
@media (prefers-reduced-motion: reduce) { .page-id-8377 .cdh-aurora::after { animation: none; } }

/* Gradient words, like the Hub's logo */
.page-id-8377 .cdh-grad { background: linear-gradient(90deg, #FF176B, #FF5B23 55%, #FF9A1F); -webkit-background-clip: text; background-clip: text; color: transparent; }
.page-id-8377 .cdh-grad-warm { background: linear-gradient(90deg, #FF8A00, #FFB020); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Eyebrow pill */
.page-id-8377 .cdh-pill .elementor-heading-title { display: inline-block; padding: 6px 14px; border: 1px solid rgba(255,138,61,.45); border-radius: 999px; background: rgba(255,138,61,.08); }

/* Cards, as on the Add-ons screen */
.page-id-8377 .cdh-card { height: 100%; }
.page-id-8377 .cdh-card > .elementor-widget-container {
  height: 100%; padding: 32px; background: #1e272f; border: 1px solid rgba(255,255,255,.07); border-radius: 16px;
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.page-id-8377 .cdh-band-alt .cdh-card > .elementor-widget-container { background: #131b22; }
.page-id-8377 .cdh-card > .elementor-widget-container:hover { border-color: rgba(255,23,107,.45); transform: translateY(-2px); box-shadow: 0 20px 50px rgba(255,23,107,.10); }
.page-id-8377 .cdh-card .elementor-icon-box-icon .elementor-icon { width: 52px; height: 52px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.page-id-8377 .cdh-step > .elementor-widget-container { padding: 24px; }
.page-id-8377 .cdh-tile .elementor-icon-box-title { margin: 0 0 2px; }

/* Screenshot cards: full-width image on top, text left-aligned */
.page-id-8377 .cdh-shot > .elementor-widget-container { padding: 16px 16px 28px; }
.page-id-8377 .cdh-shot .elementor-image-box-wrapper { text-align: left; }
.page-id-8377 .cdh-shot .elementor-image-box-img { width: 100% !important; margin: 0 0 24px !important; }
.page-id-8377 .cdh-shot .elementor-image-box-img img { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: 12px; border: 1px solid rgba(255,255,255,.06); }
.page-id-8377 .cdh-shot .elementor-image-box-content { padding: 0 12px; }

/* Glass mock-up of the Lab */
.page-id-8377 .cdh-glass { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1.2px); background-size: 14px 14px; }

/* Buttons: pink glow primary, ghost secondary */
.page-id-8377 .cdh-btn .elementor-button { transition: background-color .2s, box-shadow .2s, border-color .2s, transform .2s; }
.page-id-8377 .cdh-btn-primary .elementor-button { box-shadow: 0 10px 30px rgba(255,23,107,.35); background-image: linear-gradient(90deg, #FF176B, #FF5B23); }
.page-id-8377 .cdh-btn-primary .elementor-button:hover { transform: translateY(-1px); box-shadow: 0 14px 36px rgba(255,91,35,.45); }
.page-id-8377 .cdh-btn-ghost .elementor-button:hover { border-color: #FF8A3D; background-color: rgba(255,138,61,.08); }

@media (max-width: 767px) {
  .page-id-8377 .cdh-card > .elementor-widget-container { padding: 24px; }
  .page-id-8377 .cdh-btn, .page-id-8377 .cdh-btn .elementor-button { width: 100%; justify-content: center; }
}
