/*
 * Premium minimal conversion layer.
 * Loaded late from base.html so page-specific CSS can stay intact while key
 * conversion surfaces share a calmer, higher-trust visual language.
 */

:root {
  --hp-avant-ink: #0b1220;
  --hp-avant-muted: #667085;
  --hp-avant-line: rgba(15, 23, 42, 0.1);
  --hp-avant-panel: rgba(255, 255, 255, 0.94);
  --hp-avant-soft: #f7f5ef;
  --hp-avant-accent: #111827;
  --hp-avant-gold: #b08d57;
  --hp-avant-shadow: 0 22px 70px rgba(15, 23, 42, 0.1);
  --hp-avant-shadow-sm: 0 12px 36px rgba(15, 23, 42, 0.08);
  --hp-avant-radius: 24px;
}

[data-theme="dark"] {
  --hp-avant-ink: #f8fafc;
  --hp-avant-muted: #b6c0cf;
  --hp-avant-line: rgba(226, 232, 240, 0.16);
  --hp-avant-panel: rgba(15, 23, 42, 0.94);
  --hp-avant-soft: #121826;
  --hp-avant-accent: #f8fafc;
  --hp-avant-gold: #d6b77a;
  --hp-avant-shadow: 0 22px 70px rgba(0, 0, 0, 0.35);
  --hp-avant-shadow-sm: 0 12px 36px rgba(0, 0, 0, 0.28);
}

main .card,
main .feature-card,
main .provider-card,
main .hero-search-panel,
main .hp-ilan-form-card {
  border-color: var(--hp-avant-line) !important;
}

main .btn-primary {
  background: linear-gradient(135deg, #0b1220 0%, #1f2937 100%);
  border-color: #0b1220;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

main .btn-primary:hover,
main .btn-primary:focus {
  background: linear-gradient(135deg, #111827 0%, #334155 100%);
  border-color: #111827;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.18);
}

main .btn-outline-primary {
  color: var(--hp-avant-accent);
  border-color: rgba(15, 23, 42, 0.22);
  background: rgba(255, 255, 255, 0.72);
}

main .btn-outline-primary:hover,
main .btn-outline-primary:focus {
  color: #fff;
  background: var(--hp-avant-accent);
  border-color: var(--hp-avant-accent);
}

main .form-control:focus,
main .form-select:focus,
main .btn:focus-visible,
main a:focus-visible {
  box-shadow: 0 0 0 0.22rem rgba(176, 141, 87, 0.22) !important;
  border-color: rgba(176, 141, 87, 0.75) !important;
}

.hero-panel,
.landing-hero,
.hp-ilan-flow .hp-ilan-hero {
  isolation: isolate;
}

.hero-panel {
  background:
    radial-gradient(70% 90% at 8% 0%, rgba(176, 141, 87, 0.14), transparent 62%),
    linear-gradient(180deg, #fff 0%, var(--hp-avant-soft) 100%) !important;
  border: 1px solid var(--hp-avant-line) !important;
  border-radius: var(--hp-avant-radius) !important;
  box-shadow: var(--hp-avant-shadow) !important;
}

.hero-title {
  color: var(--hp-avant-ink) !important;
  letter-spacing: -0.045em;
}

.hero-lead {
  color: var(--hp-avant-muted) !important;
}

.hero-search-panel {
  background: var(--hp-avant-panel) !important;
  border-radius: 20px !important;
  box-shadow: var(--hp-avant-shadow-sm) !important;
  backdrop-filter: blur(12px);
}

.hp-role-card,
.hp-proof-pill,
.trust-badge {
  border-color: var(--hp-avant-line) !important;
  box-shadow: none !important;
}

.hp-role-card {
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.hp-role-card:hover,
.trust-badge:hover {
  transform: translateY(-2px);
  box-shadow: var(--hp-avant-shadow-sm) !important;
}

.hp-proof-pill {
  background: rgba(255, 255, 255, 0.72) !important;
}

.trust-badge {
  background: rgba(255, 255, 255, 0.68) !important;
  color: var(--hp-avant-ink) !important;
}

.landing-hero {
  background:
    radial-gradient(80% 120% at 82% 0%, rgba(176, 141, 87, 0.16), transparent 58%),
    linear-gradient(180deg, #fff 0%, var(--hp-avant-soft) 100%) !important;
  border-bottom: 1px solid var(--hp-avant-line) !important;
}

.landing-hero .display-5,
.landing-hero .lead {
  color: var(--hp-avant-ink);
}

.landing-cta-btn {
  background: linear-gradient(135deg, #0b1220 0%, #1f2937 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
}

.feature-card,
.provider-card {
  border-radius: 20px !important;
  box-shadow: none;
}

.hp-ilan-flow .hp-ilan-hero {
  background:
    radial-gradient(80% 150% at 88% 10%, rgba(176, 141, 87, 0.2), transparent 54%),
    linear-gradient(135deg, #0b1220 0%, #1f2937 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: var(--hp-avant-shadow) !important;
}

.hp-ilan-form-card {
  border-radius: 22px !important;
  box-shadow: var(--hp-avant-shadow-sm) !important;
}

.hp-journey-badge.active .hp-j-num,
#hp-step-bar {
  background: linear-gradient(135deg, #0b1220, #b08d57) !important;
}

.hp-journey-badge.completed .hp-j-num {
  background: #334155 !important;
}

.smart-search-results {
  background: var(--hp-avant-panel);
  border: 1px solid var(--hp-avant-line);
  border-radius: 18px;
  box-shadow: var(--hp-avant-shadow-sm);
  overflow: hidden;
  z-index: 1050;
}

.search-suggestion-item {
  padding: 0.8rem 0.9rem;
}

.search-suggestion-item:hover,
.smart-search-item-active {
  background: rgba(176, 141, 87, 0.12);
}

@media (max-width: 575.98px) {
  .hero-panel,
  .hp-ilan-flow .hp-ilan-hero {
    border-radius: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hp-role-card:hover,
  .trust-badge:hover {
    transform: none;
  }
}

[data-theme="dark"] .hero-panel,
[data-theme="dark"] .landing-hero,
[data-theme="dark"] .hero-search-panel,
[data-theme="dark"] .hp-role-card,
[data-theme="dark"] .hp-proof-pill,
[data-theme="dark"] .trust-badge,
[data-theme="dark"] .feature-card,
[data-theme="dark"] .provider-card,
[data-theme="dark"] .hp-ilan-form-card {
  background-color: var(--hp-avant-panel) !important;
  color: var(--hp-avant-ink) !important;
}

[data-theme="dark"] main .btn-outline-primary {
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(226, 232, 240, 0.22);
}
