:root {
  --ph-navy: #0d1f3c;
  --ph-gold: #b89a5a;
  --ph-red: #ED1D24;
  --ph-white: #ffffff;
  --ph-font-title: 'Playfair Display', serif;
  --ph-font-body: 'Inter', sans-serif;
}
.ph-topbar { background: var(--ph-navy); color: var(--ph-white); padding: 10px 5%; display: flex; justify-content: space-between; font-family: var(--ph-font-body); font-size: 13px; align-items: center; }
.ph-topbar a { color: var(--ph-white); text-decoration: none; transition: color 0.3s; display: flex; align-items: center; gap: 6px; }
.ph-topbar a:hover { color: var(--ph-gold); }
.ph-topbar-right { display: flex; gap: 20px; align-items: center; }

.ph-header-wrapper { position: sticky; top: 0; z-index: 1000; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(0,0,0,0.05); box-shadow: 0 4px 30px rgba(0,0,0,0.06); }
.ph-header { display: flex; align-items: center; justify-content: space-between; padding: 5px 5%; max-width: 1400px; margin: 0 auto; }
.ph-logo img { height: 50px; width: auto; object-fit: contain; }

.ph-nav { display: flex; gap: 32px; align-items: center; font-family: var(--ph-font-body); }
.ph-nav > a, .ph-dropdown > a { color: var(--ph-navy); text-decoration: none; font-weight: 600; font-size: 14px; text-transform: uppercase; letter-spacing: 0.8px; transition: color 0.3s; display: flex; align-items: center; gap: 4px; cursor: pointer; }
.ph-nav > a:hover, .ph-dropdown > a:hover { color: var(--ph-red); }

.ph-dropdown { position: relative; height: 100%; display: flex; align-items: center; }
.ph-dropdown-menu { position: absolute; top: 60px; left: -20px; background: var(--ph-white); min-width: 260px; box-shadow: 0 12px 40px rgba(0,0,0,0.12); opacity: 0; visibility: hidden; transform: translateY(15px); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); display: flex; flex-direction: column; border-top: 4px solid var(--ph-red); border-radius: 0 0 6px 6px; padding: 10px 0; }
.ph-dropdown:hover .ph-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); top: 100%; }
.ph-dropdown-menu a { padding: 14px 24px; font-size: 14px; border-bottom: 1px solid #f0f0f0; display: block; text-transform: capitalize; font-weight: 500; color: var(--ph-navy); transition: all 0.2s; }
.ph-dropdown-menu a:last-child { border-bottom: none; }
.ph-dropdown-menu a:hover { background: #fafafa; padding-left: 32px; color: var(--ph-red); }

.ph-cta { background: var(--ph-red); color: var(--ph-white) !important; padding: 14px 28px; border-radius: 6px; box-shadow: 0 6px 16px rgba(237,29,36,0.25); transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important; }
.ph-cta:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(237,29,36,0.35); background: #d0181f; }

.ph-mobile-toggle { display: none; background: none; border: none; font-size: 28px; color: var(--ph-navy); cursor: pointer; }

/* Mobile Sidebar */
.ph-mobile-nav { position: fixed; top: 0; right: -100%; width: 320px; max-width: 100%; height: 100vh; background: var(--ph-navy); color: white; z-index: 2000; transition: right 0.4s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: -10px 0 40px rgba(0,0,0,0.5); overflow-y: auto; font-family: var(--ph-font-body); }
.ph-mobile-nav.active { right: 0; }
.ph-mobile-nav-inner { padding: 30px; display: flex; flex-direction: column; gap: 24px; }
.ph-close { background: none; border: none; color: rgba(255,255,255,0.7); font-size: 32px; text-align: right; cursor: pointer; transition: color 0.3s; margin-bottom: 10px; }
.ph-close:hover { color: white; }
.ph-mobile-nav a { color: white; text-decoration: none; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.ph-mobile-subs { display: flex; flex-direction: column; gap: 16px; padding-left: 24px; margin-top: -10px; border-left: 2px solid rgba(255,255,255,0.15); }
.ph-mobile-subs a { font-size: 14px; text-transform: capitalize; color: rgba(255,255,255,0.75); font-weight: 500; }
.ph-mobile-subs a:hover { color: var(--ph-gold); }

@media (max-width: 1024px) {
  .ph-nav { display: none; }
  .ph-mobile-toggle { display: block; }
  .ph-topbar { flex-direction: column; gap: 10px; justify-content: center; text-align: center; }
  .ph-logo img { height: 50px; }
}