/* ==========================================================================
   Prime One Global — Design System V2
   PrivilegeServer Rebrand Architecture
   Official Brand Reference: https://primeone.global/press-kit
   ========================================================================== */

:root {
  /* ── 1. Official Primary Colors ────────────────────────────────────────── */
  --po-navy:              #162229;
  --po-orange:            #FF4917;
  --po-light-gray:        #F2F2F2;

  /* ── 2. Official Alternate Navy Tones ─────────────────────────────────── */
  --po-navy-deepest:      #0C1F2E;
  --po-navy-dark:         #142939;
  --po-navy-mid:          #203240;
  --po-navy-soft:         #2E3840;
  --po-navy-charcoal:     #232527;

  /* ── 3. Official Alternate Orange Tones ───────────────────────────────── */
  --po-orange-deep:       #B84526;
  --po-orange-strong:     #ED491B;
  --po-orange-vibrant:    #ED5227;
  --po-orange-bright:     #FA633A;
  --po-orange-soft:       #EF7756;
  --po-orange-glow:       rgba(255, 73, 23, 0.28);
  --po-orange-dim:        rgba(255, 73, 23, 0.12);
  --po-orange-subtle:     rgba(255, 73, 23, 0.06);

  /* ── 4. Official Functional Alternates ────────────────────────────────── */
  --po-functional-blue:   #026ccc;
  --po-functional-red:    #ff2731;
  --po-functional-teal:   #00c7ce;
  --po-functional-gray:   #3f3f3f;

  /* ── 5. Surfaces & Backgrounds ────────────────────────────────────────── */
  --po-bg-base:           #0B151C;
  --po-bg-surface:        #162229;
  --po-bg-elevated:       #1D2D37;
  --po-bg-card:           rgba(22, 34, 41, 0.92);
  --po-bg-card-hover:     rgba(32, 50, 64, 0.96);
  --po-bg-glass:          rgba(22, 34, 41, 0.75);

  /* ── 6. Text Tokens ───────────────────────────────────────────────────── */
  --po-text-white:        #ffffff;
  --po-text-primary:      #ffffff;
  --po-text-secondary:    #c5d0d8;
  --po-text-muted:        #8b9ea9;
  --po-text-dark:         #162229;
  --po-text-dark-muted:   #4e616d;

  /* ── 7. Borders ───────────────────────────────────────────────────────── */
  --po-border:            rgba(255, 255, 255, 0.09);
  --po-border-subtle:     rgba(255, 255, 255, 0.05);
  --po-border-hover:      rgba(255, 73, 23, 0.45);
  --po-border-active:     #FF4917;

  /* ── 8. Buttons & Controls ────────────────────────────────────────────── */
  --po-btn-bg:            #FF4917;
  --po-btn-text:          #ffffff;
  --po-btn-hover-bg:      #FA633A;
  --po-btn-active-bg:     #ED491B;

  /* ── 9. Backward Compatibility Overrides ──────────────────────────────── */
  --brand-lime:           #FF4917 !important;
  --brand-emerald:        #FF4917 !important;
  --brand-dark:           #162229 !important;
  --nav-bg:               #162229 !important;
  --primary-color:        #FF4917 !important;
  --dark-color:           #162229 !important;

  --ps-dark:              #0B151C !important;
  --ps-dark-surface:      #162229 !important;
  --ps-dark-card:         #142939 !important;
  --ps-dark-elevated:     #203240 !important;
  --ps-lime:              #FF4917 !important;
  --ps-lime-hover:        #FA633A !important;
  --ps-lime-glow:         rgba(255, 73, 23, 0.28) !important;
  --ps-lime-dim:          rgba(255, 73, 23, 0.12) !important;
  --ps-lime-border:       rgba(255, 73, 23, 0.4) !important;
  --ps-border-dark-hover: rgba(255, 73, 23, 0.5) !important;
  --ps-shadow-lime:       0 0 35px rgba(255, 73, 23, 0.22) !important;

  /* Typography variables */
  --font-heading:         'Cerebri Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-primary:         'Cerebri Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body:            'Ubuntu', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-alt:             'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ─── Global Typography Rules ───────────────────────────────────────────── */
html, body {
  font-family: var(--font-body) !important;
  color: var(--po-text-dark);
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.ps-hero-headline,
.ps-section-title,
.hero-title,
.section-heading,
.plan-name,
.pricing-title {
  font-family: var(--font-heading) !important;
  font-weight: 700;
  letter-spacing: -0.015em;
}

p, li, td, th, label, input, select, textarea {
  font-family: var(--font-body) !important;
}

/* Stylistic elements using Montserrat alternate */
.ps-badge-cyber,
.badge-v2,
.btn-ps-primary,
.btn-ps-secondary,
.get-started-btn,
.auth-actions-v3 a,
.auth-actions-v3 button,
.sp-btn,
.mega-col-h,
.ps-micro-trust-item,
.ps-toggle-btn {
  font-family: var(--font-alt) !important;
  letter-spacing: 0.03em;
}

/* ─── Header & Navigation Revamp (Prime One V2) ─────────────────────────── */
.engineered-header {
  background: #ffffff;
  border-bottom: none;
}

.header-top-tier {
  background: #ffffff;
}

.header-slanted-bg {
  background: #162229 !important; /* Primary Dark Navy */
}

.phone-icon-circle {
  border-color: rgba(255, 73, 23, 0.4) !important;
}

.phone-icon-circle i {
  color: #FF4917 !important;
}

.auth-actions-v3 a,
.auth-actions-v3 button {
  background: #FF4917 !important;
  color: #ffffff !important;
  font-family: var(--font-alt) !important;
  font-weight: 700;
  border-radius: 6px;
  transition: all 0.25s ease;
}

.auth-actions-v3 a.reg-btn {
  background: #ffffff !important;
  color: #162229 !important;
  border: 1px solid rgba(22, 34, 41, 0.15) !important;
}

.auth-actions-v3 a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(255, 73, 23, 0.35);
}

.auth-actions-v3 a.reg-btn:hover {
  background: #F2F2F2 !important;
  color: #FF4917 !important;
}

.wishlist-node-v3:hover {
  color: #FF4917 !important;
}

.wishlist-badge,
.badge-v3-cart {
  background: #FF4917 !important;
  color: #ffffff !important;
}

/* ─── Main Navigation Tier ──────────────────────────────────────────────── */
.header-nav-tier {
  background: #162229 !important; /* Prime One Dark Navy */
  border-bottom: 2px solid rgba(255, 73, 23, 0.4) !important; /* Subtle Orange Accent Line */
  box-shadow: 0 4px 20px rgba(12, 31, 46, 0.15);
}

.main-nav-v3 li a {
  color: #ffffff !important;
  font-family: var(--font-heading) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  padding: 16px 22px !important;
  transition: all 0.25s ease;
}

.main-nav-v3 li a:hover:not(.active a) {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #FF4917 !important;
}

.main-nav-v3 li.active > a {
  background: rgba(255, 73, 23, 0.14) !important;
  color: #FF4917 !important;
  position: relative;
}

.main-nav-v3 li.active > a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 20%;
  right: 20%;
  height: 3px;
  background: #FF4917;
  border-radius: 3px 3px 0 0;
}

/* ─── Mega Menu (Modern Dark Navy Surface) ──────────────────────────────── */
.mega-menu-v3 {
  background: #162229 !important;
  border-top: 3px solid #FF4917 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45) !important;
}

.mega-col-h {
  color: #FF4917 !important;
  font-family: var(--font-alt) !important;
  font-weight: 700;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.mega-node {
  border-radius: 8px;
  transition: all 0.2s ease;
}

.mega-node:hover,
.mega-node.active-node {
  background: rgba(255, 255, 255, 0.04) !important;
  border-left: 3px solid #FF4917 !important;
}

.mega-node .node-icon {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #FF4917 !important;
}

.mega-node:hover .node-icon {
  background: #FF4917 !important;
  color: #ffffff !important;
}

.mega-node .node-title {
  color: #ffffff !important;
  font-family: var(--font-heading) !important;
}

.mega-node .node-desc {
  color: #8b9ea9 !important;
  font-family: var(--font-body) !important;
}

.mega-promo-box {
  background: #142939 !important;
  border: 1px solid rgba(255, 73, 23, 0.25) !important;
}

.mega-promo-title {
  color: #FF4917 !important;
  font-family: var(--font-heading) !important;
}

.mega-promo-btn {
  background: #FF4917 !important;
  color: #ffffff !important;
  border-radius: 6px;
}

/* ─── Hamburger & Side Panel ────────────────────────────────────────────── */
.hamburger-trigger:hover {
  background: #FF4917 !important;
}

.side-panel {
  background: #162229 !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}

.side-panel-close:hover {
  background: #FF4917 !important;
  color: #ffffff !important;
}

.sp-btn-login {
  background: #FF4917 !important;
  color: #ffffff !important;
}

.sp-btn-register {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

.sp-btn-register:hover {
  background: #203240 !important;
  color: #FF4917 !important;
}

.sp-nav a:hover {
  background: rgba(255, 73, 23, 0.1) !important;
  color: #FF4917 !important;
}

.sp-nav a i {
  color: #FF4917 !important;
}

.sp-footer-note i {
  color: #FF4917 !important;
}

/* ─── Buttons System ────────────────────────────────────────────────────── */
.btn-ps-primary,
.btn-hero-solid,
.get-started-btn:hover {
  background: #FF4917 !important;
  border-color: #FF4917 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 18px rgba(255, 73, 23, 0.32) !important;
}

.btn-ps-primary:hover,
.btn-hero-solid:hover {
  background: #FA633A !important;
  border-color: #FA633A !important;
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(255, 73, 23, 0.42) !important;
}

.btn-ps-secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

.btn-ps-secondary:hover {
  background: #203240 !important;
  border-color: #FF4917 !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

.get-started-btn,
.price-btn {
  border-color: #FF4917 !important;
  color: #162229 !important;
}

.get-started-btn::before,
.price-btn::before {
  background-color: #FF4917 !important;
}

.price-content-wrap.active .price-btn,
.ps-pricing-card.featured .btn-ps-primary {
  background: #FF4917 !important;
  border-color: #FF4917 !important;
  color: #ffffff !important;
}

/* ─── Badges & Eyebrows ─────────────────────────────────────────────────── */
.ps-badge-cyber {
  background: rgba(255, 73, 23, 0.1) !important;
  border: 1px solid rgba(255, 73, 23, 0.35) !important;
  color: #FF4917 !important;
}

.ps-pulse-dot {
  background: #FF4917 !important;
  box-shadow: 0 0 10px #FF4917 !important;
}

.ps-highlight {
  color: #FF4917 !important;
  background: linear-gradient(135deg, #FF4917 0%, #FA633A 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ─── Pricing Card & Packages Overrides ─────────────────────────────────── */
.ps-pricing-toggle-wrap {
  background: rgba(22, 34, 41, 0.06);
  border: 1px solid rgba(22, 34, 41, 0.12);
}

.ps-toggle-btn.active {
  background: #FF4917 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(255, 73, 23, 0.35) !important;
}

.ps-discount-pill {
  background: rgba(255, 73, 23, 0.15) !important;
  color: #ED491B !important;
  border: 1px solid rgba(255, 73, 23, 0.3) !important;
}

.ps-pricing-card.featured {
  border-color: #FF4917 !important;
  box-shadow: 0 15px 45px rgba(255, 73, 23, 0.18) !important;
}

.ps-card-badge {
  background: #FF4917 !important;
  color: #ffffff !important;
}

.ps-price-value,
.ps-price-currency {
  color: #162229 !important;
  font-family: var(--font-heading) !important;
}

.ps-feature-check {
  color: #FF4917 !important;
}

/* ─── Hero Ambient Glow & Highlights ────────────────────────────────────── */
.ps-hero-ambient-glow {
  background: radial-gradient(circle at 60% 50%, rgba(255, 73, 23, 0.16) 0%, rgba(22, 34, 41, 0.05) 50%, transparent 75%) !important;
}

.ps-hero-highlight-item i {
  color: #FF4917 !important;
}

.ps-micro-trust-item i {
  color: #FF4917 !important;
}

/* ─── Modern Card Footer Overrides ──────────────────────────────────────── */
.footer-section-modern {
  background-color: #0C1F2E !important; /* Deep Navy */
}

.footer-card {
  background: #162229 !important; /* Primary Navy */
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.footer-logo span {
  color: #FF4917 !important;
}

.footer-column-title {
  font-family: var(--font-heading) !important;
  font-weight: 700;
  color: #ffffff !important;
}

.footer-links-list li a:hover {
  color: #FF4917 !important;
  transform: translateX(4px);
}

.footer-social-link:hover {
  background: #FF4917 !important;
  border-color: #FF4917 !important;
  color: #ffffff !important;
}

.newsletter-submit-btn {
  background: #FF4917 !important;
  color: #ffffff !important;
}

.newsletter-submit-btn:hover {
  background: #FA633A !important;
}

.footer-bottom-tier {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.footer-legal-links a:hover {
  color: #FF4917 !important;
}

/* ─── Accessibility & Focus States ──────────────────────────────────────── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #FF4917 !important;
  outline-offset: 2px !important;
}