/* Halla AI — Premium marketing layer (React-portaled sections) */

.hp3d-scene {
  position: relative;
  width: min(100%, 340px);
  height: 420px;
  margin: 0 auto;
  perspective: 1200px;
  transform-style: preserve-3d;
}

.hp3d-phone {
  position: absolute;
  inset: 12% 8% 8%;
  border-radius: 36px;
  background: linear-gradient(145deg, #1a1f2e 0%, #0d1117 55%, #151b28 100%);
  box-shadow:
    0 40px 80px rgba(197,160,89, 0.18),
    0 12px 32px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transform: rotateY(-14deg) rotateX(8deg);
  animation: hp3d-float 6s ease-in-out infinite;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.hp3d-phone::before {
  content: "";
  position: absolute;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  width: 72px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
}

.hp3d-screen {
  position: absolute;
  inset: 28px 14px 14px;
  border-radius: 24px;
  background: linear-gradient(180deg, var(--consult-ink) 0%, var(--consult-ink-soft) 100%);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.hp3d-screen-glow {
  position: absolute;
  inset: -40% -20%;
  background: radial-gradient(circle at 50% 0%, rgba(197,160,89, 0.22), transparent 58%);
  pointer-events: none;
}

.hp3d-call-header {
  padding: 16px 14px 10px;
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.hp3d-call-header p {
  margin: 0;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--consult-text-faint);
}

.hp3d-call-header strong {
  display: block;
  margin-top: 6px;
  font-size: 0.95rem;
  color: var(--consult-text);
  font-weight: 600;
}

.hp3d-avatar {
  width: 56px;
  height: 56px;
  margin: 18px auto 10px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--consult-accent), var(--consult-accent-soft));
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  font-weight: 800;
  color: #fff;
  box-shadow: 0 0 0 6px rgba(197,160,89, 0.2);
}

.hp3d-status {
  text-align: center;
  font-size: 0.75rem;
  color: var(--consult-accent-soft);
  font-weight: 600;
}

.hp3d-bubble {
  margin: 14px 12px 0;
  padding: 10px 12px;
  border-radius: 14px 14px 14px 4px;
  background: rgba(197,160,89, 0.12);
  border: 1px solid rgba(197,160,89, 0.25);
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--consult-text);
}

.hp3d-wave {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
  height: 36px;
  margin: 16px 12px 0;
}

.hp3d-wave span {
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--consult-accent-soft), var(--consult-accent));
  animation: hp3d-wave 1.2s ease-in-out infinite;
}

.hp3d-wave span:nth-child(2) { animation-delay: 0.1s; }
.hp3d-wave span:nth-child(3) { animation-delay: 0.2s; }
.hp3d-wave span:nth-child(4) { animation-delay: 0.3s; }
.hp3d-wave span:nth-child(5) { animation-delay: 0.15s; }
.hp3d-wave span:nth-child(6) { animation-delay: 0.25s; }
.hp3d-wave span:nth-child(7) { animation-delay: 0.05s; }

.hp3d-float-card {
  position: absolute;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(197,160,89, 0.2);
  box-shadow: 0 12px 32px rgba(197,160,89, 0.15);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--consult-accent-soft);
  animation: hp3d-card-float 5s ease-in-out infinite;
}

.hp3d-float-card--lead { top: 8%; right: -4%; }
.hp3d-float-card--appt { bottom: 18%; left: -8%; animation-delay: 1.5s; }

@keyframes hp3d-float {
  0%, 100% { transform: rotateY(-14deg) rotateX(8deg) translateY(0); }
  50% { transform: rotateY(-14deg) rotateX(8deg) translateY(-10px); }
}

@keyframes hp3d-card-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@keyframes hp3d-wave {
  0%, 100% { height: 8px; opacity: 0.5; }
  50% { height: 28px; opacity: 1; }
}

/* Premium hero grid */
.hero.hero--premium {
  text-align: left;
  padding: 88px 0 72px;
  background:
    radial-gradient(ellipse 80% 60% at 70% 0%, rgba(197,160,89, 0.1), transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 80%, rgba(197,160,89, 0.06), transparent 50%),
    var(--white);
  overflow: hidden;
}

.hero.hero--premium .hero-sub { margin-left: 0; margin-right: 0; max-width: 520px; }

.hero-premium-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.hero-premium-visual { min-height: 380px; display: flex; align-items: center; justify-content: center; }

/* Premium sections */
.premium-section {
  padding: 88px 0;
  position: relative;
}

.premium-section--muted { background: var(--gray-50); }
.premium-section--dark {
  /* Explicit dark tones, not var(--consult-ink)/--consult-ink-soft — those
     flipped to white in the rebrand (see their definition in halla_styles.css),
     which silently broke every rgba(248,250,252,…) / rgba(255,255,255,…)
     child rule in this "dark" section that assumed a dark background under
     white text. Reuses the same dark-chrome palette as .hp3d-phone rather
     than inventing a new one. */
  background: linear-gradient(180deg, #1a1f2e 0%, #0d1117 60%, #151b28 100%);
  color: #F4EFE4;
}

.premium-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 14px;
}

.premium-section--dark .premium-label { color: var(--consult-accent-soft); }
/* halla_styles.css sets a global `h2 { color: var(--black) }` / `h3 { … }`
   rule — a direct match always beats an inherited value, so
   .premium-section--dark's own `color` (above) never reaches headings on
   its own. Without this, every dark-section heading renders near-black on
   a near-black background regardless of what the section sets. */
.premium-section--dark h2,
.premium-section--dark h3:not(.premium-features-core) { color: #F4EFE4; }

.premium-section h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  line-height: 1.15;
  margin-bottom: 16px;
}

.premium-section p.lead {
  font-size: 1.05rem;
  color: var(--gray-600);
  line-height: 1.7;
  max-width: 560px;
}

.premium-section--dark p.lead { color: var(--consult-text-muted); }

/* Problem / solution */
.premium-scenario-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 40px;
}

.premium-scenario-card {
  border-radius: 20px;
  padding: 28px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.premium-scenario-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(197,160,89, 0.1);
}

.premium-scenario-card--problem { border-color: rgba(239, 68, 68, 0.2); }
.premium-scenario-card--solution {
  border-color: rgba(197,160,89, 0.25);
  background: linear-gradient(135deg, rgba(197,160,89, 0.04), #fff);
}

.premium-scenario-steps {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.premium-scenario-step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.88rem;
  color: var(--gray-700);
}

.premium-scenario-step .step-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gray-300);
  flex-shrink: 0;
}

.premium-scenario-card--solution .step-dot { background: var(--accent); }

/* Interactive call demo */
.premium-call-demo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.premium-call-phone {
  border-radius: 24px;
  background: linear-gradient(180deg, var(--consult-ink), var(--consult-ink-soft));
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.25);
}

.premium-call-stages {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.premium-call-stage {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  font-size: 0.9rem;
  font-weight: 500;
  transition: border-color 0.2s, background 0.2s;
}

.premium-call-stage.is-active {
  border-color: var(--accent);
  background: rgba(197,160,89, 0.06);
  color: var(--accent-dark);
}

.premium-call-stage-num {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--gray-100);
  display: grid;
  place-items: center;
  font-size: 0.75rem;
  font-weight: 700;
}

.premium-call-stage.is-active .premium-call-stage-num {
  background: var(--accent);
  color: #fff;
}

/* Workflow */
.premium-workflow {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin-top: 40px;
  position: relative;
}

.premium-workflow::before {
  content: "";
  position: absolute;
  top: 28px;
  left: 10%;
  right: 10%;
  height: 2px;
  background: linear-gradient(90deg, var(--accent), var(--accent-mid));
  opacity: 0.35;
  z-index: 0;
}

.premium-workflow-step {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 20px 12px;
  border-radius: 16px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  transition: transform 0.2s;
}

.premium-workflow-step:hover { transform: translateY(-4px); }

.premium-workflow-num {
  width: 40px;
  height: 40px;
  margin: 0 auto 12px;
  border-radius: 12px;
  background: var(--accent);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.85rem;
}

.premium-workflow-step h4 { font-size: 0.85rem; margin-bottom: 6px; }
.premium-workflow-step p { font-size: 0.75rem; color: var(--gray-500); margin: 0; }

/* Video placeholder */
.premium-video-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 36px;
}

.premium-video-card {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--gray-200);
  background: var(--white);
  transition: transform 0.2s, box-shadow 0.2s;
}

.premium-video-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(197,160,89, 0.12);
}

.premium-video-thumb {
  aspect-ratio: 16/10;
  /* Explicit dark tones, not var(--consult-ink) — this is a self-contained
     device-chrome mockup (a WebGL/CSS interactive demo screen), not a page
     section. --consult-ink is white post-rebrand, which broke this card's
     always-white child text once the gradient's start stop went dark→light.
     Kept dark end-to-end (not fading to the bright accent-soft gold) so the
     status label and wave bars — which use that same gold — never blend
     into the background. */
  background: linear-gradient(135deg, #171512, #3A2E1A);
  display: grid;
  place-items: center;
  position: relative;
}

.premium-video-play {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  display: grid;
  place-items: center;
  color: var(--accent);
  font-size: 1.1rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

.premium-video-card-body { padding: 16px; }
.premium-video-card-body h4 { font-size: 0.9rem; margin-bottom: 4px; }
.premium-video-card-body p { font-size: 0.8rem; color: var(--gray-500); margin: 0; }

/* Interactive call-flow demos (not recorded video) */
.premium-video-thumb--interactive {
  display: block;
  padding: 16px;
  align-content: stretch;
}

.premium-demo-ui {
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.premium-demo-status {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--consult-accent);
}

.premium-demo-messages {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 88px;
}

.premium-demo-bubble {
  font-size: 11px;
  line-height: 1.45;
  padding: 8px 10px;
  border-radius: 10px;
  max-width: 92%;
}

.premium-demo-bubble--caller {
  align-self: flex-start;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.82);
}

.premium-demo-bubble--ai {
  align-self: flex-end;
  background: rgba(197,160,89, 0.22);
  color: #F4E9D8;
  border: 1px solid rgba(197,160,89, 0.25);
}

.premium-demo-ui .premium-demo-badge {
  align-self: center;
  font-size: 10px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(52, 211, 153, 0.15);
  color: #6ee7b7;
  border: 1px solid rgba(52, 211, 153, 0.35);
}

.premium-demo-ui .premium-demo-wave {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 22px;
  margin-top: auto;
}

.premium-demo-ui .premium-demo-wave span {
  width: 3px;
  border-radius: 2px;
  background: var(--consult-accent);
  animation: premium-demo-wave 1.1s ease-in-out infinite;
}

@keyframes premium-demo-wave {
  0%, 100% { height: 6px; opacity: 0.45; }
  50% { height: 18px; opacity: 1; }
}

.premium-demo-tag {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.45);
  color: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Features hub */
.premium-features-hub {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 40px;
  align-items: center;
  margin-top: 36px;
}

.premium-features-orbit {
  position: relative;
  min-height: 360px;
  display: grid;
  place-items: center;
}

.premium-features-orbit::before,
.premium-features-orbit::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px dashed rgba(197,160,89, 0.22);
  pointer-events: none;
}

.premium-features-orbit::before {
  width: 260px;
  height: 260px;
}

.premium-features-orbit::after {
  width: 340px;
  height: 340px;
  border-color: rgba(197,160,89, 0.12);
}

.premium-features-core {
  width: 140px;
  height: 140px;
  border-radius: 24px;
  background: linear-gradient(135deg, var(--accent), var(--accent-mid));
  color: #fff;
  display: grid;
  place-items: center;
  text-align: center;
  font-weight: 800;
  font-size: 0.85rem;
  line-height: 1.3;
  box-shadow: 0 20px 48px rgba(197,160,89, 0.3);
  z-index: 2;
}

.premium-feature-pill {
  position: absolute;
  padding: 12px 16px;
  border-radius: 14px;
  background: var(--white);
  color: var(--consult-text);
  border: 1px solid var(--gray-200);
  font-size: 0.8rem;
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  cursor: default;
  transition: border-color 0.2s, transform 0.2s;
}

.premium-feature-pill:hover,
.premium-feature-pill:focus-visible {
  border-color: var(--accent);
  transform: scale(1.04);
}

.premium-feature-pill:nth-child(2):hover,
.premium-feature-pill:nth-child(2):focus-visible,
.premium-feature-pill:nth-child(5):hover,
.premium-feature-pill:nth-child(5):focus-visible {
  transform: translateX(-50%) scale(1.04);
}

.premium-feature-pill:nth-child(2) { top: 8%; left: 50%; transform: translateX(-50%); }
.premium-feature-pill:nth-child(3) { top: 28%; right: 0; }
.premium-feature-pill:nth-child(4) { bottom: 28%; right: 4%; }
.premium-feature-pill:nth-child(5) { bottom: 8%; left: 50%; transform: translateX(-50%); }
.premium-feature-pill:nth-child(6) { bottom: 28%; left: 0; }
.premium-feature-pill:nth-child(7) { top: 28%; left: 0; }

/* Before / after */
.premium-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 36px;
}

.premium-compare-col {
  border-radius: 20px;
  padding: 28px;
}

.premium-compare-col--without {
  background: #fef2f2;
  border: 1px solid #fecaca;
}

.premium-compare-col--with {
  background: linear-gradient(135deg, rgba(197,160,89, 0.08), rgba(197,160,89, 0.06));
  border: 1px solid rgba(197,160,89, 0.25);
}

.premium-compare-col h3 { font-size: 1.1rem; margin-bottom: 16px; }

.premium-compare-flow {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.premium-compare-flow span {
  font-size: 0.88rem;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.7);
}

/* Dashboard showcase */
.premium-dashboard-wrap {
  perspective: 1400px;
  margin-top: 40px;
}

.premium-dashboard-frame {
  transform: rotateX(8deg) rotateY(-6deg);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    0 40px 80px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(197,160,89, 0.15);
  background: var(--consult-ink);
}

.premium-dashboard-chrome {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 16px;
  background: var(--consult-ink-soft);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.premium-dashboard-chrome span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
}

.premium-dashboard-chrome span:first-child { background: #ef4444; }
.premium-dashboard-chrome span:nth-child(2) { background: #f59e0b; }
.premium-dashboard-chrome span:nth-child(3) { background: #10b981; }

.premium-dashboard-body {
  padding: 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  min-height: 220px;
}

.premium-dash-card {
  border-radius: 12px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.premium-dash-card strong {
  display: block;
  font-size: 1.5rem;
  color: var(--consult-accent-soft);
  margin-bottom: 4px;
}

.premium-dash-card span { font-size: 0.75rem; color: var(--consult-text-faint); }

/* Industry cards */
.premium-industry-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 32px;
}

.premium-industry-card {
  padding: 20px;
  border-radius: 16px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
  cursor: pointer;
}

.premium-industry-card:hover {
  transform: translateY(-4px) rotateX(4deg);
  border-color: var(--accent);
  box-shadow: 0 12px 32px rgba(197,160,89, 0.12);
}

.premium-industry-card i { font-size: 1.5rem; color: var(--accent); display: block; margin-bottom: 8px; }
.premium-industry-card span { font-size: 0.85rem; font-weight: 600; }

/* GCC badge */
.premium-gcc-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.premium-gcc-badge {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  background: rgba(197,160,89, 0.12);
  border: 1px solid rgba(197,160,89, 0.3);
  color: var(--accent);
}

/* Enhanced 3D hero (R3F + particles) */
.hp3d-scene--enhanced {
  width: min(100%, 380px);
  height: 440px;
}

.hp3d-particles {
  position: absolute;
  inset: -20%;
  width: 140%;
  height: 140%;
  pointer-events: none;
  opacity: 0.55;
  z-index: 0;
}

.hp3d-orbit {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(197,160,89, 0.25);
  pointer-events: none;
  z-index: 1;
}

.hp3d-orbit--outer {
  inset: 0;
  animation: hp3d-orbit-spin 24s linear infinite;
}

.hp3d-orbit--inner {
  inset: 18%;
  border-color: rgba(197,160,89, 0.35);
  animation: hp3d-orbit-spin 16s linear infinite reverse;
}

@keyframes hp3d-orbit-spin {
  from { transform: rotateZ(0deg); }
  to { transform: rotateZ(360deg); }
}

.hp3d-device-wrap {
  position: absolute;
  inset: 8% 6% 6%;
  z-index: 2;
  transform-style: preserve-3d;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.hp3d-device-wrap--tilt {
  will-change: transform;
}

.hp3d-depth-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px dashed rgba(197,160,89, 0.22);
  pointer-events: none;
  z-index: 0;
}

.hp3d-depth-ring--a {
  inset: 6%;
  transform: rotateX(72deg) scale(0.92);
  opacity: 0.55;
}

.hp3d-depth-ring--b {
  inset: 22%;
  transform: rotateX(72deg) scale(0.78);
  opacity: 0.35;
  border-color: rgba(197,160,89, 0.3);
}

.hp3d-r3f-layer {
  width: 100%;
  height: 100%;
  border-radius: 24px;
  overflow: hidden;
}

.premium-call-phone--3d {
  position: relative;
}

.premium-call-orb {
  position: absolute;
  top: -28px;
  right: -12px;
  width: 72px;
  height: 72px;
  z-index: 2;
  pointer-events: none;
}

.premium-voice-orb-canvas {
  width: 100%;
  height: 100%;
}

.premium-voice-orb-css {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #A9D3F8 0%, var(--consult-accent) 42%, var(--consult-accent-soft) 100%);
  box-shadow:
    0 0 24px rgba(197,160,89, 0.45),
    inset 0 -8px 18px rgba(197,160,89, 0.35);
  animation: premium-voice-orb-pulse 2.8s ease-in-out infinite;
}

@keyframes premium-voice-orb-pulse {
  0%, 100% { transform: scale(1); opacity: 0.92; }
  50% { transform: scale(1.06); opacity: 1; }
}

/* Outcome compare (unified before/after + scenarios) */
.premium-outcome-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 28px 0 24px;
}

.premium-outcome-tab {
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gray-600);
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s, background 0.2s, box-shadow 0.2s;
}

.premium-outcome-tab.is-active,
.premium-outcome-tab:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
  background: rgba(197,160,89, 0.06);
  box-shadow: 0 4px 16px rgba(197,160,89, 0.1);
}

.premium-outcome-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 20px;
  align-items: stretch;
  margin-top: 8px;
}

.premium-outcome-scenario-title {
  grid-column: 1 / -1;
  text-align: center;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--gray-500);
  margin: 0 0 4px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.premium-outcome-col {
  border-radius: 20px;
  padding: 24px;
}

.premium-outcome-col--without {
  background: #fef2f2;
  border: 1px solid #fecaca;
}

.premium-outcome-col--with {
  background: linear-gradient(135deg, rgba(197,160,89, 0.08), rgba(197,160,89, 0.06));
  border: 1px solid rgba(197,160,89, 0.25);
}

.premium-outcome-col h3 {
  font-size: 1rem;
  margin-bottom: 16px;
}

.premium-outcome-col--with h3 { color: var(--accent-dark); }

.premium-outcome-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.premium-outcome-steps li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.88rem;
  line-height: 1.4;
}

.premium-outcome-step-num {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 0.68rem;
  font-weight: 800;
  background: rgba(0, 0, 0, 0.06);
  color: var(--gray-500);
}

.premium-outcome-col--with .premium-outcome-step-num {
  background: rgba(197,160,89, 0.15);
  color: var(--accent-dark);
}

.premium-outcome-divider {
  display: grid;
  place-items: center;
  padding: 0 4px;
}

.premium-outcome-divider span {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--gray-400);
  background: var(--gray-100);
  border: 1px solid var(--gray-200);
}

/* See Halla AI in action — featured live demo */
.premium-action-feature {
  display: grid;
  grid-template-columns: minmax(0, 340px) 1fr;
  gap: 32px;
  align-items: center;
  margin: 36px 0 40px;
  padding: 28px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.premium-action-phone {
  margin: 0 auto;
  width: 100%;
  max-width: 300px;
}

.premium-action-stages {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.premium-section--dark .premium-call-stage {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
  color: rgba(248, 250, 252, 0.7);
}

.premium-section--dark .premium-call-stage.is-active {
  background: rgba(197,160,89, 0.18);
  border-color: rgba(197,160,89, 0.35);
  color: #F4EFE4;
}

.premium-action-divider {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 8px 0 28px;
  color: rgba(248, 250, 252, 0.45);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.premium-action-divider::before,
.premium-action-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.1);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hp3d-phone,
  .hp3d-float-card,
  .hp3d-wave span,
  .hp3d-orbit,
  .mkt-atmosphere__orb,
  .premium-demo-ui .premium-demo-wave span { animation: none !important; }
  .hp3d-device-wrap--tilt { transition: none !important; }
  .premium-voice-orb-css { animation: none !important; }
  .premium-scenario-card:hover,
  .premium-workflow-step:hover,
  .premium-video-card:hover,
  .premium-industry-card:hover { transform: none; }
}

/* Responsive */
@media (max-width: 960px) {
  .hero-premium-grid,
  .premium-call-demo,
  .premium-features-hub,
  .premium-scenario-grid,
  .premium-compare,
  .premium-outcome-grid { grid-template-columns: 1fr; }

  .premium-outcome-divider {
    padding: 8px 0;
  }

  .premium-outcome-divider span {
    width: 36px;
    height: 36px;
  }

  .premium-action-feature {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .hero.hero--premium { text-align: center; padding: 64px 0 48px; }
  .hero.hero--premium .hero-sub { margin: 0 auto 36px; }
  .hero.hero--premium .hero-actions { justify-content: center; }

  .hp3d-scene { height: 340px; margin-top: 24px; }
  .hp3d-phone { transform: rotateY(0) rotateX(4deg); }

  .premium-workflow { grid-template-columns: 1fr; }
  .premium-workflow::before { display: none; }

  .premium-video-grid { grid-template-columns: 1fr; }
  .premium-industry-grid { grid-template-columns: repeat(2, 1fr); }

  .hp3d-float-card--lead { right: 0; }
  .hp3d-float-card--appt { left: 0; }
}

/* ─── Marketing atmosphere (CSS 3D depth) ─── */
.mkt-atmosphere {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.mkt-atmosphere--auth {
  opacity: 0.9;
}

.mkt-atmosphere--marketing {
  opacity: 0.55;
}

.mkt-atmosphere__grid {
  position: absolute;
  left: -20%;
  right: -20%;
  bottom: -30%;
  height: 55%;
  transform: perspective(900px) rotateX(68deg);
  transform-origin: center top;
  background-image:
    linear-gradient(rgba(197,160,89, 0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(197,160,89, 0.14) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to top, black 15%, transparent 85%);
}

.mkt-atmosphere__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  animation: mkt-orb-drift 18s ease-in-out infinite;
}

.mkt-atmosphere__orb--1 {
  width: 420px;
  height: 420px;
  top: -12%;
  right: -8%;
  background: rgba(197,160,89, 0.22);
}

.mkt-atmosphere__orb--2 {
  width: 320px;
  height: 320px;
  bottom: 8%;
  left: -10%;
  background: rgba(197,160,89, 0.16);
  animation-delay: -6s;
}

.mkt-atmosphere__orb--3 {
  width: 240px;
  height: 240px;
  top: 38%;
  left: 42%;
  background: rgba(197,160,89, 0.12);
  animation-delay: -12s;
}

.mkt-atmosphere__particles {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0.35;
}

@keyframes mkt-orb-drift {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(12px, -18px, 0) scale(1.06); }
}

/* ─── Auth split layout + showcase ─── */
.auth-layout-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
}

.auth-layout-form {
  display: flex;
  justify-content: center;
}

.auth-showcase {
  display: none;
}

@media (min-width: 1024px) {
  .auth-layout-split {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 420px);
    gap: 48px;
  }

  .auth-showcase {
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding-right: 12px;
  }

  .auth-showcase__eyebrow {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--accent-dark);
  }

  .auth-showcase__title {
    margin: 10px 0 0;
    font-size: clamp(1.75rem, 2.4vw, 2.35rem);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--foreground);
  }

  .auth-showcase__title-accent {
    display: block;
    background: linear-gradient(135deg, var(--consult-accent) 0%, var(--consult-accent-soft) 55%, var(--consult-accent-soft) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .auth-showcase__lead {
    margin: 14px 0 0;
    max-width: 420px;
    font-size: 0.98rem;
    line-height: 1.65;
    color: var(--gray-600);
  }

  .auth-showcase__visual {
    display: flex;
    justify-content: center;
    transform: scale(0.92);
    transform-origin: center top;
  }

  .auth-showcase__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    max-width: 420px;
  }

  .auth-showcase__stat {
    padding: 14px 12px;
    border-radius: 14px;
    border: 1px solid rgba(197,160,89, 0.18);
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(8px);
    text-align: center;
    box-shadow: 0 8px 24px rgba(197,160,89, 0.08);
    transform: translateZ(0);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }

  .auth-showcase__stat:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(197,160,89, 0.14);
  }

  .auth-showcase__stat strong {
    display: block;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--accent-dark);
  }

  .auth-showcase__stat span {
    display: block;
    margin-top: 4px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--gray-500);
  }
}

/* Premium section depth accents */
.premium-section--muted::before,
.premium-section:not(.premium-section--dark)::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 60% 40% at 100% 0%, rgba(197,160,89, 0.06), transparent 55%);
}

.premium-section--dark::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 50% 45% at 0% 100%, rgba(197,160,89, 0.08), transparent 55%),
    radial-gradient(ellipse 40% 35% at 100% 0%, rgba(197,160,89, 0.1), transparent 50%);
}

/* ─── Dashboard 3D panels (replaces screenshot images) ─── */
.dash3d-mount {
  min-height: 320px;
  background: var(--consult-ink);
}

.browser-frame .dash3d-mount {
  background: linear-gradient(180deg, var(--consult-ink) 0%, var(--consult-ink-soft) 100%);
}

.dash3d-scene {
  position: relative;
  perspective: 1200px;
  padding: 28px 24px 32px;
  min-height: 300px;
  overflow: hidden;
}

.dash3d-scene--summary {
  background: linear-gradient(160deg, var(--consult-text) 0%, #eef2f7 100%);
  min-height: 280px;
}

.dash3d-ambient {
  position: absolute;
  inset: -20%;
  background: radial-gradient(circle at 30% 20%, rgba(197,160,89, 0.18), transparent 45%);
  pointer-events: none;
}

.dash3d-orbit-ring {
  position: absolute;
  top: 12%;
  right: 8%;
  width: 120px;
  height: 120px;
  border: 1px dashed rgba(197,160,89, 0.25);
  border-radius: 50%;
  pointer-events: none;
  animation: dash3d-orbit-spin 18s linear infinite;
}

@keyframes dash3d-orbit-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.dash3d-panel {
  position: relative;
  z-index: 2;
  border-radius: 14px;
  transform-style: preserve-3d;
  transition: transform 0.15s ease-out;
  box-shadow:
    0 24px 48px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.06);
}

.dash3d-panel--tilt {
  transform: rotateX(6deg) rotateY(-4deg);
}

.dash3d-scene--summary .dash3d-panel--tilt {
  transform: rotateX(4deg) rotateY(5deg);
}

.dash3d-float {
  position: absolute;
  z-index: 3;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 700;
  background: var(--white);
  color: var(--consult-text);
  border: 1px solid rgba(197,160,89, 0.2);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
  animation: dash3d-float 5s ease-in-out infinite;
}

.dash3d-float--live {
  top: 16px;
  right: 20px;
  color: var(--accent-dark);
}

.dash3d-float--sent {
  bottom: 20px;
  right: 24px;
  background: linear-gradient(135deg, var(--accent), var(--accent-mid));
  color: #fff;
  border: none;
}

@keyframes dash3d-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

.dash3d-ui--dark {
  display: grid;
  grid-template-columns: 72px 1fr;
  background: var(--consult-ink);
  border-radius: 14px;
  overflow: hidden;
  min-height: 260px;
}

.dash3d-sidebar {
  padding: 16px 10px;
  background: rgba(0, 0, 0, 0.25);
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.dash3d-logo {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--accent), var(--accent-mid));
  color: #fff;
  font-weight: 800;
  display: grid;
  place-items: center;
  margin: 0 auto;
}

.dash3d-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dash3d-nav-item {
  font-size: 0.62rem;
  font-weight: 600;
  color: rgba(248, 250, 252, 0.45);
  padding: 8px 6px;
  border-radius: 8px;
  text-align: center;
}

.dash3d-nav-item--active {
  background: rgba(197,160,89, 0.12);
  color: var(--consult-accent-soft);
}

.dash3d-main {
  padding: 18px 20px;
  color: var(--consult-text);
}

.dash3d-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.dash3d-main-head h4 {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--consult-text);
}

.dash3d-chip {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(197,160,89, 0.12);
  color: var(--consult-accent-soft);
}

.dash3d-field {
  margin-bottom: 12px;
}

.dash3d-field label {
  display: block;
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(248, 250, 252, 0.5);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.dash3d-input,
.dash3d-textarea {
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.8rem;
  color: var(--consult-text);
  line-height: 1.45;
}

.dash3d-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.dash3d-pills span {
  font-size: 0.72rem;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(248, 250, 252, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.dash3d-pill-active {
  background: rgba(197,160,89, 0.25);
  color: var(--consult-accent-soft);
  border-color: rgba(197,160,89, 0.35);
}

.dash3d-preview-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 14px;
}

.dash3d-mini-stat {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.dash3d-mini-stat strong {
  display: block;
  font-size: 1rem;
  color: var(--consult-accent-soft);
}

.dash3d-mini-stat span {
  font-size: 0.68rem;
  color: rgba(248, 250, 252, 0.5);
}

.dash3d-summary-wrap {
  position: relative;
  padding: 8px 0;
}

.dash3d-email-card {
  border-radius: 14px;
  padding: 18px 20px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.dash3d-email-card--primary {
  position: relative;
  z-index: 2;
}

.dash3d-email-card--ghost {
  position: absolute;
  top: 24px;
  left: 12px;
  right: 12px;
  opacity: 0.45;
  transform: translateY(12px) scale(0.96);
  z-index: 1;
}

.dash3d-email-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.dash3d-email-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(197,160,89, 0.1);
  color: var(--accent-dark);
  display: grid;
  place-items: center;
  font-size: 0.9rem;
  flex-shrink: 0;
}

.dash3d-email-head strong {
  display: block;
  font-size: 0.88rem;
  color: var(--consult-text);
}

.dash3d-email-head span {
  display: block;
  margin-top: 2px;
  font-size: 0.72rem;
  color: var(--gray-500);
}

.dash3d-email-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dash3d-email-list li {
  font-size: 0.78rem;
  color: var(--gray-700);
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--gray-50);
}

.dash3d-email-list li span {
  display: block;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gray-400);
  margin-bottom: 2px;
}

.dash3d-email-footer {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.dash3d-badge {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--gray-100);
  color: var(--gray-600);
}

.dash3d-badge--success {
  background: rgba(197,160,89, 0.12);
  color: var(--accent-dark);
}

@media (max-width: 960px) {
  .dash3d-ui--dark {
    grid-template-columns: 1fr;
  }

  .dash3d-sidebar {
    flex-direction: row;
    align-items: center;
    padding: 12px 16px;
  }

  .dash3d-nav {
    flex-direction: row;
    flex: 1;
    justify-content: center;
  }

  .dash3d-float {
    font-size: 0.68rem;
    padding: 8px 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dash3d-orbit-ring,
  .dash3d-float {
    animation: none;
  }

  .dash3d-panel--tilt {
    transform: none;
  }
}

/* ============ HOME CLOSING SECTION (premium) ============ */
.premium-section-head { max-width: 640px; margin: 0 auto 40px; }
.premium-section-head.text-center { text-align: center; }
.premium-section-head .lead { margin-top: 12px; }

.premium-pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 980px;
  margin: 0 auto;
  align-items: start;
}

.premium-pricing-card {
  position: relative;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 20px;
  padding: 28px 24px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.premium-pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(197,160,89, 0.1);
}

.premium-pricing-card--popular {
  border-color: rgba(197,160,89, 0.35);
  box-shadow: 0 20px 48px rgba(197,160,89, 0.14);
}

.premium-pricing-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--accent-dark);
  background: rgba(197,160,89, 0.1);
  padding: 4px 10px;
  border-radius: 999px;
}

.premium-pricing-plan {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gray-500);
  margin-bottom: 8px;
}

.premium-pricing-price {
  font-size: 2.6rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--black);
  line-height: 1;
}

.premium-pricing-price sup { font-size: 1.1rem; vertical-align: super; }
.premium-pricing-price sub { font-size: 0.95rem; color: var(--gray-500); font-weight: 600; }

.premium-pricing-mins {
  font-size: 0.8rem;
  color: var(--gray-500);
  margin: 10px 0 18px;
}

.premium-pricing-features {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--gray-100);
  padding-top: 16px;
}

.premium-pricing-features li {
  font-size: 0.84rem;
  color: var(--gray-600);
  padding: 6px 0 6px 22px;
  position: relative;
}

.premium-pricing-features li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--accent);
  font-weight: 800;
}

.premium-testimonial-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.premium-testimonial-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 18px;
  padding: 24px 22px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
  transition: border-color 0.2s, transform 0.2s;
}

.premium-testimonial-card:hover {
  border-color: rgba(197,160,89, 0.3);
  transform: translateY(-2px);
}

.premium-testimonial-stars {
  color: #f59e0b;
  font-size: 0.9rem;
  margin-bottom: 12px;
}

.premium-testimonial-card p {
  font-size: 0.92rem;
  line-height: 1.65;
  color: var(--gray-600);
  margin-bottom: 18px;
}

.premium-testimonial-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

.premium-testimonial-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 0.85rem;
  color: #fff;
  background: linear-gradient(135deg, var(--accent), var(--accent-mid));
}

.premium-testimonial-author strong {
  display: block;
  font-size: 0.88rem;
  color: var(--black);
}

.premium-testimonial-author span {
  display: block;
  font-size: 0.75rem;
  color: var(--gray-500);
}

.premium-consult-bridge {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  padding: 8px;
}

.premium-consult-bridge .neon-gradient-card-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  flex-wrap: wrap;
  background: linear-gradient(135deg, #F4EFE4 0%, #fff 55%) !important;
}

.premium-consult-bridge-copy { max-width: 560px; }
.premium-consult-bridge-copy p {
  margin-top: 10px;
  color: var(--gray-600);
  font-size: 0.95rem;
}

.premium-section--cta { padding-bottom: 96px; }

.premium-final-cta {
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}

.premium-final-cta .lead {
  color: var(--consult-text-muted);
  margin-top: 14px;
}

.premium-final-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 28px;
}

.premium-cta-ghost {
  color: rgba(255, 255, 255, 0.82) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  background: transparent !important;
}

.premium-cta-ghost:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
}

.premium-final-cta-note {
  margin-top: 18px;
  font-size: 0.78rem;
  color: rgba(248, 250, 252, 0.38);
}

@media (max-width: 960px) {
  .premium-pricing-grid,
  .premium-testimonial-grid {
    grid-template-columns: 1fr;
  }

  .premium-consult-bridge .neon-gradient-card-inner {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ───── Hub hero: three-pillar entry strip (#consult-pillars on the consultancy landing page) ─────
   Kept in this file, not inline in the HTML. Class prefix hx- on purpose: marketing-apple.css forces
   letter-spacing/case on any class containing "eyebrow", so the label is .hx-kicker. */
.hx-strip{background:#16191D;color:#FAF9F6;border-top:1px solid rgba(197,160,89,.28);padding:72px 0 88px}
.hx-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.hx-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:36px}
.hx-kicker{font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;font-size:.95rem;letter-spacing:.16em;text-transform:uppercase;color:#C5A059}
html[lang="ar"] .hx-kicker{letter-spacing:0;font-size:.85rem}
.hx-title{letter-spacing:-.01em;font-family:'Cormorant Garamond','Cinzel',Georgia,serif;font-weight:500;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1.15;margin:0;max-width:30ch;color:#FAF9F6}
html[lang="ar"] .hx-title,html[lang="ar"] .hx-card h3{letter-spacing:0}
html[lang="ar"] .hx-title{font-size:clamp(1.8rem,2.9vw,2.5rem);line-height:1.35}
.hx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:0;border:1px solid rgba(250,249,246,.14)}
.hx-card{display:flex;flex-direction:column;gap:14px;padding:34px 30px 30px;text-decoration:none;color:inherit;position:relative;transition:background .25s ease,transform .25s ease}
.hx-card+.hx-card{border-inline-start:1px solid rgba(250,249,246,.14)}
.hx-card::before{content:"";position:absolute;inset-inline:0;top:0;height:2px;background:#C5A059;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
html[dir="rtl"] .hx-card::before{transform-origin:right}
.hx-card:hover,.hx-card:focus-visible{background:rgba(197,160,89,.06)}
.hx-card:hover::before,.hx-card:focus-visible::before{transform:scaleX(1)}
.hx-card:focus-visible{outline:2px solid #C5A059;outline-offset:-2px}
.hx-num{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.6rem;color:#C5A059;letter-spacing:.08em}
.hx-card h3{letter-spacing:-.005em;font-family:'Cormorant Garamond','Cinzel',Georgia,serif;font-weight:500;font-size:2.2rem;line-height:1.15;margin:0;color:#FAF9F6}
html[lang="ar"] .hx-card h3{font-size:2.3rem;line-height:1.3}
.hx-tag{font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;font-size:1rem;font-weight:600;letter-spacing:.04em;color:#C5A059;margin:0}
.hx-desc{font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;font-size:1.1rem;line-height:1.6;color:rgba(250,249,246,.72);margin:0;flex:1}
html[lang="ar"] .hx-desc{font-size:1.02rem;line-height:1.8}
.hx-go{font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;font-size:1.05rem;font-weight:600;color:#FAF9F6;margin-top:6px}
.hx-card:hover .hx-go{color:#C5A059}
@media (max-width:900px){
 .hx-grid{grid-template-columns:1fr}
 .hx-card+.hx-card{border-inline-start:0;border-top:1px solid rgba(250,249,246,.14)}
 .hx-strip{padding:56px 0 64px}
}
@media (prefers-reduced-motion:reduce){.hx-card,.hx-card::before{transition:none}}
