/* Phoenix premium animation layer */
#phoenix-site {
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
}

#phoenix-site .header {
  animation: phoenixHeaderReveal 0.9s var(--ease-premium) both;
  transition:
    background 0.45s ease,
    box-shadow 0.45s ease,
    border-color 0.45s ease;
}

#phoenix-site .brand img {
  transition:
    transform 0.6s var(--ease-premium),
    filter 0.6s ease,
    opacity 0.45s ease;
}

#phoenix-site .brand:hover img {
  transform: translateY(-2px) scale(1.035);
  filter: drop-shadow(0 16px 28px rgba(201, 154, 46, 0.22));
}

#phoenix-site .nav a {
  position: relative;
  transition:
    color 0.35s ease,
    opacity 0.35s ease,
    transform 0.35s var(--ease-premium),
    letter-spacing 0.35s ease;
}

#phoenix-site .nav a::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0.95;
  transform: translateX(-50%);
  transition: width 0.48s var(--ease-premium);
}

#phoenix-site .nav a:hover {
  color: var(--white);
  opacity: 1;
  transform: translateY(-2px);
}

#phoenix-site .nav a:hover::before,
#phoenix-site .nav a.active::before {
  width: 100%;
}

#phoenix-site .language-switcher,
#phoenix-site .phoenix-language-floating {
  transition:
    transform 0.35s var(--ease-premium),
    box-shadow 0.35s ease,
    border-color 0.35s ease,
    background 0.35s ease;
}

#phoenix-site .language-switcher:hover,
#phoenix-site .phoenix-language-floating:hover {
  transform: translateY(-2px);
  border-color: rgba(201, 154, 46, 0.72);
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.28),
    0 0 28px rgba(201, 154, 46, 0.12);
}

#phoenix-site .hero {
  isolation: isolate;
}

#phoenix-site .hero-slide {
  transition: opacity 1.25s ease, transform 1.25s ease;
}

#phoenix-site .hero-slide.active img {
  animation: phoenixHeroDrift 18s ease-in-out both;
}

#phoenix-site .hero-shade::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 42%, rgba(201, 154, 46, 0.12), transparent 30%),
    radial-gradient(circle at 78% 20%, rgba(255, 255, 255, 0.08), transparent 34%);
  mix-blend-mode: screen;
  opacity: 0.75;
  animation: phoenixGlowDrift 9s ease-in-out infinite alternate;
}

#phoenix-site .hero-copy.visible .eyebrow {
  animation: phoenixTextRise 0.72s var(--ease-premium) both 0.04s;
}

#phoenix-site .hero-copy.visible h1 {
  animation: phoenixTextRise 0.86s var(--ease-premium) both 0.12s;
}

#phoenix-site .hero-copy.visible .hero-text {
  animation: phoenixTextRise 0.9s var(--ease-premium) both 0.22s;
}

#phoenix-site .hero-copy.visible .hero-actions {
  animation: phoenixTextRise 0.92s var(--ease-premium) both 0.32s;
}

#phoenix-site .slide-dot {
  transition:
    width 0.45s var(--ease-premium),
    background 0.35s ease,
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

#phoenix-site .slide-dot:hover {
  transform: translateY(-2px);
}

#phoenix-site .slide-dot.active {
  width: 68px;
  box-shadow: 0 0 22px rgba(201, 154, 46, 0.42);
}

#phoenix-site .quote-card {
  transform-origin: top center;
  transition:
    transform 0.55s var(--ease-premium),
    box-shadow 0.55s ease,
    border-color 0.45s ease;
}

#phoenix-site .quote-card.visible {
  animation: phoenixCardEnter 0.92s var(--ease-premium) both;
}

#phoenix-site .quote-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 44px 110px rgba(0, 0, 0, 0.18);
}

#phoenix-site .field input,
#phoenix-site .field select,
#phoenix-site .phone-input-group,
#phoenix-site .phone-combo {
  transition:
    border-color 0.28s ease,
    background 0.28s ease,
    box-shadow 0.28s ease,
    transform 0.28s var(--ease-premium);
}

#phoenix-site .phone-input-group {
  box-sizing: border-box;
  max-width: 100%;
}

#phoenix-site .phone-input-group input {
  box-sizing: border-box;
  min-width: 0;
}

#phoenix-site .field:focus-within input,
#phoenix-site .field:focus-within select,
#phoenix-site .field:focus-within .phone-input-group,
#phoenix-site .field:focus-within .phone-combo {
  transform: translateY(-2px);
  box-shadow:
    0 14px 30px rgba(2, 11, 24, 0.08),
    0 0 0 4px rgba(201, 154, 46, 0.14);
}

#phoenix-site .field:focus-within .phone-input-group {
  border-color: rgba(201, 154, 46, 0.42) !important;
}

#phoenix-site .field:focus-within .phone-input-group input {
  transform: none !important;
  box-shadow: none !important;
}

#phoenix-site .suggestions,
#phoenix-site .phone-prefix-menu {
  transform-origin: top center;
  animation: phoenixDropdown 0.28s var(--ease-premium) both;
}

#phoenix-site .suggestion-item,
#phoenix-site .phone-prefix-option {
  transition:
    background 0.22s ease,
    transform 0.22s ease,
    padding-left 0.22s ease;
}

#phoenix-site .suggestion-item:hover,
#phoenix-site .phone-prefix-option:hover {
  transform: translateX(4px);
}

#phoenix-site .price-estimate.visible,
#phoenix-site .price-card.visible {
  animation: phoenixCardEnter 0.55s var(--ease-premium) both;
}

#phoenix-site .service-card {
  position: relative;
  overflow: hidden;
  transition:
    transform 0.55s var(--ease-premium),
    box-shadow 0.55s ease,
    border-color 0.45s ease,
    background 0.45s ease;
}

#phoenix-site .service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg, transparent 0%, rgba(201, 154, 46, 0.1) 45%, transparent 72%);
  transform: translateX(-120%);
  transition: transform 0.75s var(--ease-premium);
}

#phoenix-site .service-card:hover {
  transform: translateY(-8px) scale(1.012);
  border-color: rgba(201, 154, 46, 0.36);
  box-shadow: 0 30px 70px rgba(2, 11, 24, 0.13);
}

#phoenix-site .service-card:hover::after {
  transform: translateX(120%);
}

#phoenix-site .service-icon {
  transition:
    transform 0.5s var(--ease-premium),
    box-shadow 0.45s ease,
    background 0.45s ease;
}

#phoenix-site .service-card:hover .service-icon {
  transform: rotate(-6deg) scale(1.08);
  box-shadow: 0 16px 34px rgba(2, 11, 24, 0.18);
}

#phoenix-site .fleet-card {
  transition:
    transform 0.55s var(--ease-premium),
    filter 0.45s ease;
}

#phoenix-site .fleet-card:hover {
  transform: translateY(-6px);
  filter: drop-shadow(0 30px 70px rgba(0, 0, 0, 0.28));
}

#phoenix-site .fleet-card-face {
  transition:
    border-color 0.45s ease,
    box-shadow 0.45s ease;
}

#phoenix-site .fleet-card:hover .fleet-card-face {
  border-color: rgba(201, 154, 46, 0.68);
  box-shadow:
    0 34px 78px rgba(0, 0, 0, 0.36),
    0 0 34px rgba(201, 154, 46, 0.1);
}

#phoenix-site .fleet-card-front img {
  transition: transform 1.2s var(--ease-premium), filter 0.8s ease;
}

#phoenix-site .fleet-card:hover .fleet-card-front img {
  transform: scale(1.055);
  filter: saturate(1.08) contrast(1.04);
}

#phoenix-site .empty-state {
  position: relative;
  overflow: hidden;
  transition:
    transform 0.55s var(--ease-premium),
    box-shadow 0.55s ease,
    border-color 0.45s ease;
}

#phoenix-site .empty-state:hover {
  transform: translateY(-6px);
  box-shadow: 0 34px 86px rgba(2, 11, 24, 0.12);
  border-color: rgba(201, 154, 46, 0.34);
}

#phoenix-site .instagram-link {
  transition:
    transform 0.4s var(--ease-premium),
    box-shadow 0.4s ease,
    border-color 0.35s ease;
}

#phoenix-site .instagram-link:hover {
  transform: translateY(-3px);
  box-shadow: 0 22px 46px rgba(0, 0, 0, 0.18);
}

#phoenix-site .footer .brand img {
  transition:
    transform 0.55s var(--ease-premium),
    filter 0.55s ease;
}

#phoenix-site .footer .brand:hover img {
  transform: translateY(-4px) scale(1.04);
  filter: drop-shadow(0 22px 35px rgba(201, 154, 46, 0.18));
}

#phoenix-site .footer-legal a {
  position: relative;
}

#phoenix-site .footer-legal a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -4px;
  height: 1px;
  background: var(--gold);
  transition: right 0.35s var(--ease-premium);
}

#phoenix-site .footer-legal a:hover::after {
  right: 0;
}

#phoenix-site .reveal {
  transition:
    opacity 0.95s var(--ease-premium),
    transform 0.95s var(--ease-premium),
    filter 0.95s ease;
  filter: blur(3px);
}

#phoenix-site .reveal.visible {
  filter: blur(0);
}

#phoenix-site .service-list .service-card:nth-child(2),
#phoenix-site .fleet-grid .fleet-card:nth-child(2) {
  transition-delay: 0.08s;
}

#phoenix-site .service-list .service-card:nth-child(3),
#phoenix-site .fleet-grid .fleet-card:nth-child(3) {
  transition-delay: 0.16s;
}

#phoenix-site .fleet-grid .fleet-card:nth-child(4) {
  transition-delay: 0.24s;
}

@keyframes phoenixHeaderReveal {
  from {
    opacity: 0;
    transform: translateY(-16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes phoenixHeroDrift {
  from {
    transform: scale(1.03) translate3d(0, 0, 0);
  }
  50% {
    transform: scale(1.08) translate3d(-1.2%, -0.8%, 0);
  }
  to {
    transform: scale(1.055) translate3d(0.8%, 0.4%, 0);
  }
}

@keyframes phoenixGlowDrift {
  from {
    opacity: 0.55;
    transform: translate3d(-1.5%, -1%, 0) scale(1);
  }
  to {
    opacity: 0.9;
    transform: translate3d(1.5%, 1%, 0) scale(1.04);
  }
}

@keyframes phoenixTextRise {
  from {
    opacity: 0;
    filter: blur(3px);
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

@keyframes phoenixCardEnter {
  from {
    opacity: 0;
    filter: blur(3px);
    transform: translateY(24px) scale(0.985);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@keyframes phoenixDropdown {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 680px) {
  #phoenix-site .hero-slide.active img {
    animation-duration: 20s;
  }

  #phoenix-site .service-card:hover,
  #phoenix-site .fleet-card:hover,
  #phoenix-site .empty-state:hover,
  #phoenix-site .quote-card:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  #phoenix-site *,
  #phoenix-site *::before,
  #phoenix-site *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}

/* Premium preview parity layer: intentionally more visible */
#phoenix-site .hero {
  isolation: isolate;
}

#phoenix-site .hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 80% 18%, rgba(201, 154, 46, 0.16), transparent 28%),
    linear-gradient(110deg, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.28) 48%, rgba(2, 11, 24, 0.46) 100%);
  opacity: 0.92;
}

#phoenix-site .hero-slide.active img {
  animation: phoenixPreviewHeroMove 18s cubic-bezier(0.22, 1, 0.36, 1) infinite alternate !important;
  filter: saturate(1.1) contrast(1.08) brightness(0.96) !important;
}

#phoenix-site .hero-copy {
  position: relative;
  z-index: 4;
}

#phoenix-site .hero-copy .eyebrow,
#phoenix-site .hero-copy h1,
#phoenix-site .hero-copy .hero-text,
#phoenix-site .hero-actions,
#phoenix-site .hero-control,
#phoenix-site .hero-caption {
  animation: phoenixPreviewEnter 1s cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

#phoenix-site .hero-copy h1 {
  animation-delay: 0.08s !important;
  text-shadow: 0 24px 60px rgba(0, 0, 0, 0.42);
}

#phoenix-site .hero-copy .hero-text {
  animation-delay: 0.18s !important;
}

#phoenix-site .hero-actions {
  animation-delay: 0.28s !important;
}

#phoenix-site .hero-control,
#phoenix-site .hero-caption {
  animation-delay: 0.42s !important;
}

@media (min-width: 681px) {
  #phoenix-site .header {
    animation-duration: 2s !important;
  }

  #phoenix-site .hero-copy .eyebrow,
  #phoenix-site .hero-copy h1,
  #phoenix-site .hero-copy .hero-text,
  #phoenix-site .hero-actions,
  #phoenix-site .hero-control,
  #phoenix-site .hero-caption {
    animation-duration: 2s !important;
  }

  #phoenix-site .hero-copy .eyebrow {
    animation-delay: 0.1s !important;
  }

  #phoenix-site .hero-copy h1 {
    animation-delay: 0.3s !important;
  }

  #phoenix-site .hero-copy .hero-text {
    animation-delay: 0.55s !important;
  }

  #phoenix-site .hero-actions {
    animation-delay: 0.8s !important;
  }

  #phoenix-site .hero-control,
  #phoenix-site .hero-caption {
    animation-delay: 1.05s !important;
  }
}

#phoenix-site .btn,
#phoenix-site .quote-submit,
#phoenix-site #lead-submit,
#phoenix-site .instagram-link {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  animation: phoenixPreviewButtonPulse 2.8s ease-in-out infinite !important;
  box-shadow:
    0 18px 36px rgba(201, 154, 46, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}

#phoenix-site .btn::before,
#phoenix-site .quote-submit::before,
#phoenix-site #lead-submit::before,
#phoenix-site .instagram-link::before {
  content: "";
  position: absolute;
  inset: -35% -80%;
  z-index: -1;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.42) 50%, transparent 65%);
  transform: translateX(-55%) rotate(8deg);
  animation: phoenixPreviewShine 3.4s ease-in-out infinite;
}

#phoenix-site .btn:hover,
#phoenix-site .quote-submit:hover,
#phoenix-site #lead-submit:hover,
#phoenix-site .instagram-link:hover {
  transform: translateY(-8px) scale(1.035) !important;
  box-shadow:
    0 32px 72px rgba(201, 154, 46, 0.38),
    0 0 0 1px rgba(255, 255, 255, 0.22) inset !important;
}

#phoenix-site .nav a {
  position: relative;
}

#phoenix-site .nav a::after {
  transition: width 0.36s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.36s ease !important;
}

#phoenix-site .nav a:hover {
  color: #d6aa2d !important;
  transform: translateY(-4px) !important;
  text-shadow: 0 0 18px rgba(201, 154, 46, 0.22);
}

#phoenix-site .language-switcher,
#phoenix-site .phoenix-language-floating {
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.26),
    inset 0 0 0 1px rgba(201, 154, 46, 0.26) !important;
}

#phoenix-site .quote-card,
#phoenix-site .service-card,
#phoenix-site .fleet-card-inner,
#phoenix-site .empty-state,
#phoenix-site .lead-form-card {
  box-shadow:
    0 22px 60px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(201, 154, 46, 0.08) inset !important;
}

#phoenix-site .quote-card:hover,
#phoenix-site .service-card:hover,
#phoenix-site .fleet-card:hover .fleet-card-inner,
#phoenix-site .empty-state:hover,
#phoenix-site .lead-form-card:hover {
  transform: translateY(-12px) !important;
  box-shadow:
    0 42px 96px rgba(0, 0, 0, 0.28),
    0 0 46px rgba(201, 154, 46, 0.14),
    0 0 0 1px rgba(201, 154, 46, 0.42) inset !important;
}

#phoenix-site .reveal {
  opacity: 0;
  transform: translateY(36px) scale(0.985);
  filter: blur(4px);
  transition:
    opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.9s ease !important;
}

#phoenix-site .reveal.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
}

#phoenix-site .field input:focus,
#phoenix-site .field select:focus,
#phoenix-site .phone-combo:focus-within {
  transform: translateY(-5px) !important;
  box-shadow:
    0 18px 38px rgba(2, 11, 24, 0.14),
    0 0 0 4px rgba(201, 154, 46, 0.2) !important;
}

@keyframes phoenixPreviewHeroMove {
  0% { transform: scale(1.06) translate3d(0, 0, 0); }
  50% { transform: scale(1.15) translate3d(-2.2%, -1.4%, 0); }
  100% { transform: scale(1.1) translate3d(1.8%, 1.1%, 0); }
}

@keyframes phoenixPreviewEnter {
  from { opacity: 0; transform: translate3d(0, 34px, 0); filter: blur(4px); }
  to { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); }
}

@keyframes phoenixPreviewButtonPulse {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.08) saturate(1.12); }
}

@keyframes phoenixPreviewShine {
  0%, 38% { transform: translateX(-65%) rotate(8deg); opacity: 0; }
  52% { opacity: 0.85; }
  72%, 100% { transform: translateX(65%) rotate(8deg); opacity: 0; }
}

/* ================= New premium interactions ================= */

#phoenix-site .phoenix-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0%;
  background: linear-gradient(90deg, var(--gold-soft), var(--gold));
  z-index: 2000;
  box-shadow: 0 0 12px rgba(201, 154, 46, 0.55);
  transition: width 0.12s linear;
  pointer-events: none;
}

#phoenix-site .header {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  transition:
    background 0.32s ease,
    border-color 0.32s ease,
    box-shadow 0.32s ease,
    backdrop-filter 0.32s ease;
}

/* The open mobile menu keeps its own full-screen surface, so the header is no
   longer re-tinted here — see the "flight deck" block in the inline stylesheet. */
#phoenix-site .header.is-scrolled {
  background: rgba(2, 11, 24, 0.97) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  backdrop-filter: blur(18px) !important;
  box-shadow:
    0 18px 46px rgba(0, 0, 0, 0.4),
    0 0 0 1px rgba(201, 154, 46, 0.14) inset !important;
  border-color: rgba(201, 154, 46, 0.4) !important;
}

/* Ambient hero orbs */

#phoenix-site .hero-ambient {
  position: absolute;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

#phoenix-site .hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  mix-blend-mode: screen;
  opacity: 0.45;
  will-change: transform, opacity;
}

#phoenix-site .hero-orb-1 {
  width: 320px;
  height: 320px;
  top: 8%;
  left: 12%;
  background: radial-gradient(circle, rgba(201, 154, 46, 0.55), transparent 70%);
  animation: phoenixOrbFloat1 16s ease-in-out infinite alternate;
}

#phoenix-site .hero-orb-2 {
  width: 260px;
  height: 260px;
  bottom: 12%;
  right: 16%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.28), transparent 70%);
  animation: phoenixOrbFloat2 20s ease-in-out infinite alternate;
}

#phoenix-site .hero-orb-3 {
  width: 200px;
  height: 200px;
  top: 42%;
  right: 34%;
  background: radial-gradient(circle, rgba(224, 182, 83, 0.4), transparent 70%);
  animation: phoenixOrbFloat3 24s ease-in-out infinite alternate;
}

@keyframes phoenixOrbFloat1 {
  from { transform: translate3d(0, 0, 0) scale(1); opacity: 0.35; }
  to { transform: translate3d(40px, 30px, 0) scale(1.15); opacity: 0.6; }
}

@keyframes phoenixOrbFloat2 {
  from { transform: translate3d(0, 0, 0) scale(1); opacity: 0.28; }
  to { transform: translate3d(-30px, -24px, 0) scale(1.1); opacity: 0.5; }
}

@keyframes phoenixOrbFloat3 {
  from { transform: translate3d(0, 0, 0) scale(1); opacity: 0.22; }
  to { transform: translate3d(20px, -18px, 0) scale(0.92); opacity: 0.4; }
}

@media (max-width: 680px) {
  #phoenix-site .hero-orb {
    display: none;
  }
}

/* Eyebrow shimmer */

#phoenix-site .eyebrow {
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-soft) 25%, #f6da8f 50%, var(--gold-soft) 75%, var(--gold) 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: phoenixEyebrowShimmer 6s ease-in-out infinite;
}

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

/* Section title accent underline */

#phoenix-site .section-title {
  position: relative;
}

#phoenix-site .section-title::after {
  content: "";
  position: absolute;
  left: 2px;
  bottom: -14px;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--gold), transparent);
  transition: width 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
}

#phoenix-site .reveal.visible .section-title::after {
  width: 84px;
}

/* Suggestion dropdown stagger */

#phoenix-site .suggestions .suggestion-item {
  animation: phoenixSuggestionIn 0.36s cubic-bezier(0.16, 1, 0.3, 1) both;
}

#phoenix-site .suggestions .suggestion-item:nth-child(1) { animation-delay: 0.02s; }
#phoenix-site .suggestions .suggestion-item:nth-child(2) { animation-delay: 0.045s; }
#phoenix-site .suggestions .suggestion-item:nth-child(3) { animation-delay: 0.07s; }
#phoenix-site .suggestions .suggestion-item:nth-child(4) { animation-delay: 0.095s; }
#phoenix-site .suggestions .suggestion-item:nth-child(5) { animation-delay: 0.12s; }
#phoenix-site .suggestions .suggestion-item:nth-child(6) { animation-delay: 0.145s; }
#phoenix-site .suggestions .suggestion-item:nth-child(n+7) { animation-delay: 0.17s; }

@keyframes phoenixSuggestionIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Cursor spotlight glow on interactive cards (excludes flip cards) */

#phoenix-site .service-card,
#phoenix-site .quote-card,
#phoenix-site .empty-state {
  --spot-x: 50%;
  --spot-y: 50%;
}

#phoenix-site .service-card::before,
#phoenix-site .quote-card::before,
#phoenix-site .empty-state::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(320px circle at var(--spot-x) var(--spot-y), rgba(201, 154, 46, 0.16), transparent 62%);
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
}

#phoenix-site .service-card:hover::before,
#phoenix-site .quote-card:hover::before,
#phoenix-site .empty-state:hover::before {
  opacity: 1;
}

/* Service card 3D tilt */

#phoenix-site .service-list {
  perspective: 1000px;
}

#phoenix-site .service-card {
  --tilt-x: 0deg;
  --tilt-y: 0deg;
}

#phoenix-site .service-card:hover {
  transform: translateY(-12px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) !important;
}

/* Restore the fleet card flip-to-specs interaction: a later "premium" pass
   had overridden its rotateY with a plain translateY, breaking the reveal.
   Desktop only: this selector has an #id, so it out-specifies the mobile
   media query rule that forces transform:none, and mobile browsers can
   apply :hover from a tap. Without this guard the card silently flips (and
   mirrors, since nothing on mobile counter-rotates it) whenever a tap
   triggers a simulated hover. */
@media (min-width: 681px) {
  #phoenix-site .fleet-card:hover .fleet-card-inner,
  #phoenix-site .fleet-card:focus-within .fleet-card-inner {
    transform: translateY(-6px) rotateY(180deg) !important;
  }
}

/* Desktop only: mobile uses a plain opacity crossfade (no rotation), so this
   3D-flip-only fix must not apply there. Safari renders the "hidden"
   backface of a rotateY-flipped element when it also has overflow:hidden +
   border-radius, showing the mirrored front face instead of hiding it.
   Forcing a mask-based compositing layer (a fully opaque mask, so it has
   no visual effect on its own) fixes it. */
@media (min-width: 681px) {
  #phoenix-site .fleet-card-face {
    -webkit-mask-image: -webkit-radial-gradient(white, white);
  }

  #phoenix-site .fleet-card-inner {
    -webkit-transform-style: preserve-3d;
  }
}

/* Header logo must stay static: no hover motion. */
#phoenix-site .header .brand:hover img {
  transform: none !important;
  filter: none !important;
}

/* The quote panel must stay put: it lifting on hover while someone is
   moving the cursor toward a field to click into it is disruptive. */
#phoenix-site .quote-card:hover {
  transform: none !important;
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.36) !important;
}

/* Desktop: let the airport dropdown show a lot more results before it needs
   to scroll internally. Nothing actually clips it against the quote card
   (it's absolutely positioned and every ancestor is overflow:visible), so
   it was only ever limited by its own max-height. */
@media (min-width: 1001px) {
  #phoenix-site .suggestions {
    max-height: 361px;
  }
}

/* No underline at all under the language options, in the pill or the
   floating widget, from any state (active/hover/focus). */
#phoenix-site .language-switcher a::after,
#phoenix-site .language-switcher a::before,
#phoenix-site .phoenix-language-floating a::after,
#phoenix-site .phoenix-language-floating a::before {
  content: none !important;
  display: none !important;
}

/* ================= Language dropdown (flags) ================= */

#phoenix-site .language-switcher.phoenix-lang,
#phoenix-site .phoenix-language-floating.phoenix-lang {
  width: auto !important;
}

#phoenix-site .language-switcher.phoenix-lang {
  position: relative;
  display: inline-flex !important;
}

@media (max-width: 680px) {
  #phoenix-site .phoenix-language-floating.phoenix-lang {
    display: inline-flex !important;
  }
}

#phoenix-site .phoenix-lang-trigger {
  display: flex;
  align-items: center;
  gap: 7px;
  background: transparent;
  border: 0;
  margin: -12px -10px;
  padding: 12px 10px;
  min-height: 44px;
  border-radius: 12px;
  color: inherit;
  font-family: inherit;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.4px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#phoenix-site .phoenix-lang-trigger:hover,
#phoenix-site .phoenix-lang.is-open .phoenix-lang-trigger {
  background: rgba(255, 255, 255, 0.06);
}

#phoenix-site .phoenix-lang-flags {
  font-size: 15px;
  line-height: 1;
  letter-spacing: -3px;
  white-space: nowrap;
}

#phoenix-site .phoenix-lang-menu .phoenix-lang-flags {
  display: inline-block;
  flex: 0 0 52px;
  width: 52px;
  min-width: 52px;
  padding: 0;
  background: transparent;
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
  font-size: 20px;
  line-height: 1;
  letter-spacing: 2px;
  opacity: 1 !important;
  filter: none !important;
}

#phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  display: inline-block;
  width: 22px;
  min-width: 22px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  font-size: 15px;
  line-height: 1;
  letter-spacing: -3px;
  opacity: 1 !important;
  filter: none !important;
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu .phoenix-lang-flags,
html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  height: 22px;
  font-size: 0;
  line-height: 0;
  letter-spacing: 0;
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  height: 17px;
}

html.phoenix-png-lang-flags-ready[lang="es"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-es.png?v=4");
}

html.phoenix-png-lang-flags-ready[lang="en"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-en.png?v=4");
}

html.phoenix-png-lang-flags-ready[lang="pt"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-pt.png?v=4");
}

html.phoenix-png-lang-flags-ready[lang="de"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-de.png?v=4");
}

html.phoenix-png-lang-flags-ready[lang="it"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-it.png?v=4");
}

html.phoenix-png-lang-flags-ready[lang="fr"] #phoenix-site .phoenix-lang-trigger .phoenix-lang-flags {
  background-image: url("/assets/images/lang-current-fr.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="en"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-en.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="es"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-es.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="pt"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-pt.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="de"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-de.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="it"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-it.png?v=4");
}

html.phoenix-png-lang-flags-ready #phoenix-site .phoenix-lang-menu a[lang="fr"] .phoenix-lang-flags {
  background-image: url("/assets/images/lang-emoji-fr.png?v=4");
}

#phoenix-site .phoenix-lang-label {
  color: var(--gold);
}

#phoenix-site .phoenix-lang-caret {
  width: 6px;
  height: 6px;
  border-right: 1.5px solid rgba(255, 255, 255, 0.55);
  border-bottom: 1.5px solid rgba(255, 255, 255, 0.55);
  transform: rotate(45deg);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  margin-top: -3px;
}

#phoenix-site .phoenix-lang.is-open .phoenix-lang-caret {
  transform: rotate(-135deg);
  margin-top: 3px;
}

#phoenix-site .phoenix-lang-menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: rgba(2, 11, 24, 0.97);
  border: 1px solid rgba(201, 154, 46, 0.4);
  border-radius: 20px;
  padding: 8px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-10px) scale(0.96);
  transform-origin: top right;
  transition:
    opacity 0.28s ease,
    transform 0.32s cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0.32s;
  z-index: 1700;
}

#phoenix-site .phoenix-lang.is-open .phoenix-lang-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

#phoenix-site .phoenix-lang-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  min-height: 44px;
  border-radius: 13px;
  color: #f4f4f4 !important;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1.45px;
  text-transform: uppercase;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
  transition: background 0.25s ease, color 0.2s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease;
}

#phoenix-site .phoenix-lang-menu a span:not(.phoenix-lang-flags) {
  color: inherit !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

#phoenix-site .phoenix-lang-menu a:hover {
  background: rgba(255, 255, 255, 0.08);
  transform: translateX(6px);
  filter: none !important;
}

#phoenix-site .phoenix-lang-menu a.active {
  background: rgba(255, 255, 255, 0.1);
  filter: none !important;
}

#phoenix-site .mobile-language-switcher {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 14px;
}

#phoenix-site .mobile-language-switcher a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 12px;
  min-height: 44px;
  border-radius: 12px;
  color: #ffffff;
  font-weight: 800;
}

#phoenix-site .mobile-language-switcher a.active {
  background: rgba(201, 154, 46, 0.16);
  color: var(--gold-soft);
}

#phoenix-site .mobile-language-switcher .phoenix-lang-flags {
  font-size: 15px;
  letter-spacing: -3px;
}

@media (max-width: 1000px) {
  /* The full-screen mobile menu now supplies its own surface, header treatment
     and language switcher (see the inline stylesheet). Only the floating
     language pill still needs to get out of the way here. */
  body.phoenix-menu-open #phoenix-site .phoenix-language-floating {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}