/* PrimeX Media — Page-specific styles: / */

.primex-content html, .primex-content body {
  margin: 0; padding: 0; background: #000;
}

.primex-content body {
  margin:0;padding:0;background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif
}

.hero-section {
  position:relative;height:100vh;min-height:600px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin:0
}

.video-background {
  position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;overflow:hidden;background-color:#000
}

.video-overlay {
  position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(0,0,0,0.7) 0%,rgba(160,32,240,0.3) 100%);z-index:2
}

.hero-content {
  position:relative;z-index:3;width:100%;padding:2rem
}

.hero-video {
  position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center 35%;z-index:0
}

@media (max-width:768px) {
  .hero-video {
    display:none
  }
  .video-background {
    background:linear-gradient(135deg,#000 0%,#1a0a26 25%,#0a0a0a 50%,#1a0a26 75%,#000 100%);background-size:400% 400%
  }
}

.primex-content {
  --pmx-purple: #a020f0;
      --pmx-purple-dark: #8a1acc;
      --pmx-purple-hover: #8a1acc;
      --pmx-purple-light: rgba(160, 32, 240, 0.1);
      --pmx-purple-glow: rgba(160, 32, 240, 0.4);
      --pmx-bg: #000000;
      --pmx-bg-elevated: #0a0a0a;
      --pmx-bg-card: #0f0f0f;
      --pmx-bg-grey: #1a1a1a;
      --pmx-nav-bg: #0a0a0a;
      --pmx-text-main: #ffffff;
      --pmx-text: #ffffff;
      --pmx-text-muted: #999999;
      --pmx-gray: #999;
      --pmx-border: #222222;
      --pmx-gradient: linear-gradient(135deg, var(--pmx-purple), var(--pmx-purple-dark));
      --pmx-gradient-grey: linear-gradient(135deg, #0a0a0a, #1a1a1a, #0a0a0a);
      --pmx-gradient-purple-subtle: linear-gradient(135deg, rgba(0, 0, 0, 0.95), rgba(26, 10, 26, 0.95), rgba(0, 0, 0, 0.95));
      --pmx-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
      --pmx-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.6);
      --pmx-shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.7);
      --pmx-shadow-purple: 0 16px 32px rgba(160, 32, 240, 0.3);
      --spacing-unit: 1rem;
      --transition-speed: 0.3s;
}

@keyframes fadeInUp {
      from { opacity: 0; transform: translateY(30px) translateZ(0); }
      to { opacity: 1; transform: translateY(0) translateZ(0); }
    }

@keyframes bounce {
      0%,20%,50%,80%,100% { transform: translateX(-50%) translateY(0) translateZ(0); }
      40% { transform: translateX(-50%) translateY(-10px) translateZ(0); }
      60% { transform: translateX(-50%) translateY(-5px) translateZ(0); }
    }

@keyframes scroll-wheel {
      0% { opacity: 1; transform: translateX(-50%) translateY(0) translateZ(0); }
      100% { opacity: 0; transform: translateX(-50%) translateY(12px) translateZ(0); }
    }

@keyframes arrow-move { 0%,100% { opacity: 0; } 50% { opacity: 1; } }

@keyframes scroll-logos { 0% { transform: translateX(0) translateZ(0); } 100% { transform: translateX(-50%) translateZ(0); } }

@keyframes gradientFlow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

@keyframes particleFloat { 0%,100% { opacity: 1; transform: translateY(0) scale(1) translateZ(0); } 50% { opacity: .8; transform: translateY(-20px) scale(1.1) translateZ(0); } }

.hero-section {
  position: relative; height: 100vh; min-height: 600px; display: flex; align-items: center; justify-content: center; overflow: hidden; margin-top: 0;
}

.video-background {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden; background-color: #000;
}

.hero-video {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; z-index: 0;
}

@media (max-width: 768px) {
  .hero-video {
    object-position: center center; display: none;
  }
  .video-background {
    background: linear-gradient(135deg, #000000 0%, #1a0a26 25%, #0a0a0a 50%, #1a0a26 75%, #000000 100%);
        background-size: 400% 400%;
        animation: gradientFlow 15s ease infinite;
  }
  .video-background::before {
    content: "";
        position: absolute; inset: 0;
        background:
          radial-gradient(circle at 20% 50%, rgba(160, 32, 240, 0.1) 0%, transparent 50%),
          radial-gradient(circle at 80% 80%, rgba(160, 32, 240, 0.08) 0%, transparent 50%),
          radial-gradient(circle at 40% 20%, rgba(138, 26, 204, 0.06) 0%, transparent 50%);
        animation: particleFloat 20s ease-in-out infinite;
  }
}

.video-overlay {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(160, 32, 240, 0.3) 100%); z-index: 2;
}

.hero-content {
  position: relative; z-index: 3; width: 100%; padding: 2rem;
}

.hero-container {
  max-width: 1200px; margin: 0 auto; text-align: center;
}

.hero-title {
  font-size: 4.5rem; font-weight: 800; line-height: 1.1; margin-bottom: 1.5rem; color: #fff; text-shadow: 0 4px 20px rgba(0,0,0,0.5);
}

.hero-subtitle {
  font-size: 1.25rem; line-height: 1.8; color: #e0e0e0; margin-bottom: 2.5rem; max-width: 700px; margin-left: auto; margin-right: auto; text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.hero-ctas {
  display: flex; gap: 1.5rem; justify-content: center; margin-bottom: 4rem; flex-wrap: wrap;
}

.hero-btn {
  padding: 1rem 2.5rem; border-radius: 8px; text-decoration: none; font-weight: 600; font-size: 1.1rem; transition: all var(--transition-speed); display: inline-block;
}

.hero-btn-primary {
  background: var(--pmx-purple); color: #fff; box-shadow: 0 4px 20px rgba(160,32,240,0.4);
}

.hero-btn-primary:hover {
  background: var(--pmx-purple-hover); transform: translateY(-3px); box-shadow: 0 6px 30px rgba(160,32,240,0.6);
}

.hero-btn-secondary {
  background: transparent; color: #fff; border: 2px solid #fff;
}

.hero-btn-secondary:hover {
  background: #fff; color: #000; transform: translateY(-3px);
}

.hero-stats {
  display:flex; justify-content:center; align-items:center; gap:3rem; flex-wrap:wrap;
}

.stat {
  display:flex; flex-direction:column; align-items:center;
}

.stat-number {
  font-size:2.5rem; font-weight:700; color:var(--pmx-purple); text-shadow:0 0 20px rgba(160,32,240,.5);
}

.stat-label {
  font-size:.9rem; color:#ccc; text-transform:uppercase; letter-spacing:1px;
}

.stat-divider {
  width:1px; height:50px; background:linear-gradient(to bottom, transparent, var(--pmx-purple), transparent);
}

.scroll-indicator {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:.5rem; animation:bounce 2s infinite;
}

.mouse {
  width:26px; height:40px; border:2px solid rgba(255,255,255,.5); border-radius:20px; position:relative;
}

.wheel {
  width:4px; height:8px; background:rgba(255,255,255,.8); border-radius:2px; position:absolute; top:8px; left:50%; transform:translateX(-50%); animation:scroll-wheel 2s infinite;
}

@media (prefers-reduced-motion: reduce) {
  .hero-video {
    display: none;
  }
  .video-background {
    background: url("https://storage.googleapis.com/msgsndr/W76WTHYm5nHSJIBGdSgR/media/6936f96d50387f19f849134a.webp") center / cover no-repeat;
  }
}

.trusted-brands-section {
  position: relative;
      padding: 4rem 0;
      overflow: hidden;
      background: linear-gradient(180deg,#0f0f0f 0%,#1a1a1a 50%,#0f0f0f 100%);
}

.trusted-brands-section::before {
  content:"";
      position:absolute; inset:0;
      background-image:
        radial-gradient(circle at 20% 30%, rgba(160, 32, 240, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(138, 26, 204, 0.06) 0%, transparent 50%);
      pointer-events:none;
}

.trusted-brands-section::after {
  content:"";
      position:absolute; top:0; left:0; right:0; height:2px;
      background:linear-gradient(90deg, transparent, var(--pmx-purple), transparent);
}

.trusted-content {
  position:relative; z-index:1;
}

.trusted-container {
  max-width:1400px; margin:0 auto; padding:0 2rem;
}

.trusted-heading {
  font-size:3rem; font-weight:700; text-align:center; margin-bottom:3rem; color:#fff; line-height:1.2; letter-spacing:-.02em;
}

.trusted-heading .highlight {
  background:linear-gradient(135deg,#a020f0 0%,#d946ef 100%);
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
      background-clip:text;
      display:inline-block;
      font-weight:800;
}

.pm-content-container {
  max-width: 1280px; margin: 0 auto; padding: 0 2rem;
}

.primex-content section {
  padding: 5rem 0; position: relative; width: 100%;
}

.primex-content section:nth-child(odd) {
  background: linear-gradient(180deg, #000000 0%, #0a0a0a 100%);
}

.primex-content section:nth-child(even) {
  background: var(--pmx-gradient-grey);
}

.pm-grid-2 {
  display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:4rem; align-items:center;
}

.pm-grid-3 {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:2rem;
}

.pm-grid-4 {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:2rem;
}

.primex-content h2, .primex-content h3, .primex-content h4 {
  margin:0 0 1.25rem; font-weight:700; letter-spacing:-.03em; line-height:1.2; color:var(--pmx-text-main);
}

.primex-content h2 {
  font-size: clamp(2rem, 4vw, 2.75rem);
}

.primex-content h3 {
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
}

.pm-eyebrow {
  font-size:.8rem; text-transform:uppercase; letter-spacing:.2em; color:var(--pmx-purple); font-weight:700; margin-bottom:.75rem; display:inline-flex; align-items:center; gap:.5rem;
}

.pm-eyebrow::before {
  content:""; width:2rem; height:2px; background:var(--pmx-gradient); border-radius:2px; box-shadow:0 0 10px rgba(160,32,240,.5);
}

.pm-lead {
  font-size:clamp(1.05rem,2vw,1.2rem); color:var(--pmx-text-muted); max-width:42rem; line-height:1.75; margin-bottom:1.5rem;
}

.pm-kicker {
  font-size:.95rem; color:var(--pmx-text-muted); line-height:1.7; margin-top:.5rem;
}

.pm-cta-row {
  display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.5rem;
}

.pm-btn {
  display:inline-flex; align-items:center; justify-content:center; padding:1rem 2rem; border-radius:999px; border:none; cursor:pointer;
      font-weight:600; font-size:1rem; text-decoration:none; transition:all .3s cubic-bezier(.4,0,.2,1); white-space:nowrap; position:relative; overflow:hidden;
}

.pm-btn-primary {
  background:var(--pmx-gradient); color:#fff; box-shadow:var(--pmx-shadow-purple);
}

.pm-btn-outline {
  background:transparent; color:var(--pmx-purple); border:2px solid var(--pmx-purple);
}

.pm-stat-row {
  display:flex; flex-wrap:wrap; gap:2.5rem; margin-top:2.5rem;
}

.pm-stat {
  min-width:150px; position:relative; padding-left:1rem;
}

.pm-stat::before {
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--pmx-gradient); border-radius:2px;
}

.pm-stat-value {
  font-size:clamp(1.8rem,3vw,2.5rem); font-weight:700; background:var(--pmx-gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:.25rem; line-height:1.2;
}

.pm-stat-label {
  font-size:.9rem; color:var(--pmx-text-muted); line-height:1.4;
}

.pm-card {
  background: rgba(15, 15, 15, 0.8);
      backdrop-filter: blur(10px);
      border-radius: 1.5rem;
      padding: 2rem;
      border: 1px solid var(--pmx-border);
      box-shadow: var(--pmx-shadow-md);
      transition: all .4s cubic-bezier(.4,0,.2,1);
      position: relative;
      overflow: hidden;
}

.pm-list {
  list-style:none; padding:0; margin:1rem 0 0;
}

.pm-list li {
  position:relative; padding-left:1.75rem; font-size:.95rem; color:var(--pmx-text-muted); margin-bottom:.75rem; line-height:1.6;
}

.pm-list li::before {
  content:""; position:absolute; left:0; top:.6rem; width:6px; height:6px; border-radius:50%; background:var(--pmx-gradient);
}

.pm-hero-image {
  width:100%; height:100%; border-radius:1.5rem; overflow:hidden; border:1px solid var(--pmx-border); box-shadow:var(--pmx-shadow-lg);
}

.pm-hero-image img {
  width:100%; height:100%; object-fit:cover; display:block;
}

.pm-as-seen-badge {
  width: 100%;
      border-radius: 1.5rem;
      overflow: hidden;
      border: 1px solid var(--pmx-border);
      background: #ffffff;
      padding: 2rem;
      box-shadow: var(--pmx-shadow-md);
      transition: all 0.4s ease;
}

.pm-as-seen-badge:hover {
  transform: translateY(-4px); box-shadow: var(--pmx-shadow-lg); border-color: rgba(160, 32, 240, 0.3);
}

.pm-as-seen-badge a {
  display:block; cursor:pointer; transition:opacity .3s ease;
}

.pm-as-seen-badge a:hover {
  opacity:.9;
}

.pm-as-seen-badge img {
  width:100%; height:auto; display:block;
}

.pm-work-filters {
  display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:2rem; margin-top:1.25rem;
}

.pm-chip {
  padding:.5rem 1.25rem; border-radius:999px; font-size:.85rem; border:2px solid var(--pmx-border); color:var(--pmx-text-muted); cursor:pointer; background:var(--pmx-bg-elevated);
}

.pm-chip--active {
  background:var(--pmx-gradient); color:#fff; border-color:var(--pmx-purple);
}

.pm-work-thumb {
  width:100%; aspect-ratio:16/9; border-radius:1rem; overflow:hidden; border:2px solid rgba(160,32,240,.3); background:var(--pmx-bg-elevated);
}

.pm-work-thumb img {
  width:100%; height:100%; object-fit:cover; display:block;
}

.pm-work-title {
  font-size:1rem; font-weight:600; margin-top:1rem; color:var(--pmx-text-main);
}

.pm-work-meta {
  font-size:.8rem; text-transform:uppercase; letter-spacing:.12em; color:var(--pmx-text-muted); margin-top:.35rem;
}

.pm-services-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.5rem; margin-top:2rem;
}

.pm-service-tag {
  font-size:.7rem; text-transform:uppercase; letter-spacing:.2em; color:var(--pmx-purple); margin-bottom:.5rem; font-weight:700;
}

.pm-service-title {
  font-size:1.05rem; font-weight:600; margin-bottom:.5rem;
}

.pm-location-row {
  display:flex; flex-wrap:wrap; gap:.75rem; margin:1rem 0 2rem;
}

.pm-location-pill {
  padding:.5rem 1rem; border-radius:999px; border:2px solid var(--pmx-border); font-size:.85rem; background:var(--pmx-bg-elevated); color:var(--pmx-text-muted);
}

.pm-location-row a.pm-location-pill {
  text-decoration: none;
      color: var(--pmx-text-muted);
      transition: all var(--transition-speed);
      cursor: pointer;
}

.pm-location-row a.pm-location-pill:hover {
  background: var(--pmx-purple);
      color: #fff;
      border-color: var(--pmx-purple);
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(160, 32, 240, 0.3);
}

.hp-form-wrapper {
  background: rgba(8, 5, 14, 0.9);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-radius: 1.5rem;
      padding: 2.25rem;
      position: relative;
      border: 1px solid rgba(160, 32, 240, 0.22);
      box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.02),
        0 24px 64px rgba(0, 0, 0, 0.7),
        0 0 60px rgba(160, 32, 240, 0.05) inset;
}

.hp-form-wrapper::before {
  content: "";
      position: absolute;
      top: 0; left: 12%; right: 12%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(160, 32, 240, 0.9), transparent);
      border-radius: 999px;
}

.hp-form-header {
  font-size: 0.6875rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.18em;
      color: #555;
      margin-bottom: 1.5rem;
      display: flex;
      align-items: center;
      gap: 0.875rem;
}

.hp-form-header::before,
    .hp-form-header::after {
  content: "";
      flex: 1;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(160, 32, 240, 0.3));
}

.hp-form-header::after {
  background: linear-gradient(90deg, rgba(160, 32, 240, 0.3), transparent);
}

.hp-form-row-two {
  display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0.875rem;
      margin-bottom: 0.875rem;
}

.hp-form-group {
  display: flex;
      flex-direction: column;
      gap: 0.4rem;
      margin-bottom: 0.875rem;
}

.hp-form-group:last-of-type {
  margin-bottom: 0;
}

.hp-form-group label {
  font-size: 0.6875rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: #555;
      padding-left: 0.2rem;
}

.hp-form-group input,
    .hp-form-group textarea {
  background: rgba(6, 4, 10, 0.9);
      border: 1px solid rgba(160, 32, 240, 0.18);
      border-radius: 0.6rem;
      padding: 0.8rem 1rem;
      color: #fff;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      font-size: 0.9rem;
      outline: none;
      transition: all 0.25s ease;
      width: 100%;
      box-sizing: border-box;
      -webkit-appearance: none;
}

.hp-form-group input::placeholder,
    .hp-form-group textarea::placeholder {
  color: rgba(100, 100, 110, 0.6);
      font-size: 0.85rem;
}

.hp-form-group input:hover,
    .hp-form-group textarea:hover {
  border-color: rgba(160, 32, 240, 0.35);
}

.hp-form-group input:focus,
    .hp-form-group textarea:focus {
  border-color: rgba(160, 32, 240, 0.65);
      box-shadow: 0 0 0 3px rgba(160, 32, 240, 0.1), 0 0 20px rgba(160, 32, 240, 0.05);
      background: rgba(10, 6, 18, 0.95);
}

.hp-form-group textarea {
  resize: none; min-height: 88px; line-height: 1.6;
}

.hp-submit-btn {
  width: 100%;
      margin-top: 1.25rem;
      padding: 1rem 2rem;
      background: linear-gradient(135deg, #a020f0, #8a1acc);
      color: #fff;
      border: none;
      border-radius: 0.75rem;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      font-size: 0.9375rem;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.75rem;
      transition: all 0.3s ease;
      box-shadow: 0 8px 24px rgba(160, 32, 240, 0.35), 0 1px 0 rgba(255,255,255,0.08) inset;
      letter-spacing: 0.04em;
      position: relative;
      overflow: hidden;
}

.hp-submit-btn::before {
  content: "";
      position: absolute; top: 0; left: -100%; width: 100%; height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
      transition: left 0.5s ease;
}

.hp-submit-btn:hover {
  transform: translateY(-2px); box-shadow: 0 14px 36px rgba(160, 32, 240, 0.5);
}

.hp-submit-btn:hover::before {
  left: 100%;
}

.hp-submit-btn svg {
  width: 16px; height: 16px; transition: transform 0.3s; flex-shrink: 0;
}

.hp-submit-btn:hover svg {
  transform: translateX(4px);
}

.hp-privacy-note {
  text-align: center;
      margin-top: 0.875rem;
      font-size: 0.7rem;
      color: rgba(100, 100, 110, 0.6);
      letter-spacing: 0.01em;
}

.hp-privacy-note svg {
  width: 11px; height: 11px; vertical-align: middle; margin-right: 0.3rem; opacity: 0.5;
}

@media (max-width: 900px) {
  .pm-grid-2 {
    grid-template-columns: 1fr; gap: 3rem;
  }
  .hero-title {
    font-size: 2.5rem;
  }
  .hero-subtitle {
    font-size:1rem;
  }
  .hp-form-row-two {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .hero-title {
    font-size: 2rem;
  }
  .hero-ctas {
    flex-direction: column; gap: 1rem;
  }
  .hero-btn {
    width: 100%; max-width: 300px; padding: .85rem 1.5rem;
  }
  .stat-divider {
    display: none;
  }
  .hp-form-wrapper {
    padding: 1.75rem 1.5rem;
  }
}