/* Custom CSS Tailwind v4 */

/* WordPress Admin Bar offset */
body.admin-bar #masthead { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar #masthead { top: 46px; }
}

/* --- 5 TẦNG CTA SYSTEM --- */
/* Tầng 1: Soft CTA (Build Trust) */
.cta-soft {
  @apply inline-block px-6 py-2.5 rounded border border-navy/30 text-navy font-semibold transition-all duration-300 hover:border-gold hover:text-gold hover:shadow-[0_0_10px_rgba(214,161,74,0.15)];
}

/* Tầng 2: Educational CTA (Deep Engagement) */
.cta-edu {
  @apply inline-flex items-center gap-2 text-navy font-semibold transition-all duration-300 hover:text-gold relative after:content-[''] after:absolute after:-bottom-1 after:left-0 after:w-0 after:h-[2px] after:bg-gold hover:after:w-full after:transition-all after:duration-300;
}

/* Tầng 3: Lead CTA (Lead Collection) */
.cta-lead {
  @apply inline-block px-8 py-3 rounded bg-gold text-white font-semibold transition-all duration-300 hover:bg-softgold hover:shadow-lg;
}

/* Tầng 4: Strategic CTA (Consultation) */
.cta-strategic {
  @apply inline-block px-8 py-3.5 rounded bg-gold text-white font-bold tracking-wide transition-all duration-300 hover:bg-softgold shadow-[0_0_15px_rgba(214,161,74,0.3)] hover:shadow-[0_0_20px_rgba(214,161,74,0.5)];
}

/* Tầng 5: High Intent CTA (Conversion) */
.cta-high-intent {
  @apply inline-block px-10 py-4 rounded bg-navy text-white font-bold tracking-wide border-2 border-gold transition-all duration-300 hover:bg-[#0a1b36] hover:shadow-[0_0_20px_rgba(214,161,74,0.4)];
}


/* --- WORDPRESS MENU STYLING --- */
#site-navigation ul { list-style: none; margin: 0; padding: 0; white-space: nowrap; }
#site-navigation > ul > li { position: relative; display: inline-block; }
#site-navigation > ul > li > a {
  position: relative;
  display: block;
  padding: 0.5rem 0.75rem;
  color: var(--color-warmwhite); 
  font-weight: 500; 
  font-size: 0.875rem;
  text-decoration: none; 
  transition: color 0.2s;
  letter-spacing: 0.02em;
}
#site-navigation > ul > li > a:hover,
#site-navigation > ul > li.current-menu-item > a { 
  color: var(--color-warmwhite); 
}

/* Hover/Active Underline */
#site-navigation > ul > li > a::before {
  content: '';
  position: absolute;
  bottom: 0.1rem;
  left: 0.75rem;
  right: 0.75rem;
  height: 2px;
  background-color: var(--color-gold);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease;
}
#site-navigation > ul > li:hover > a::before,
#site-navigation > ul > li.current-menu-item > a::before {
  transform: scaleX(1);
}

/* Dropdown Arrow */
#site-navigation > ul > li.menu-item-has-children > a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
#site-navigation > ul > li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  margin-top: 2px;
  transition: transform 0.2s;
}
#site-navigation > ul > li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* Dropdown */
#site-navigation ul.sub-menu {
  display: none; position: absolute; top: 100%; left: 0; width: 14rem; z-index: 50;
  background-color: var(--color-navy); 
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 0.25rem; 
  overflow: hidden;
}
#site-navigation > ul > li.menu-item-has-children:hover > ul.sub-menu { display: block; }
#site-navigation ul.sub-menu a {
  display: block; padding: 0.75rem 1.25rem; color: var(--color-warmwhite); text-decoration: none; font-size: 0.875rem;
}
#site-navigation ul.sub-menu a:hover { background-color: rgba(255,255,255,0.05); color: var(--color-softgold); }

/* --- FLUENTFORM OVERRIDES --- */
.fluentform.ff-default .ff-el-form-control {
  @apply px-4 py-3 border border-gray-300 rounded focus:outline-none focus:ring-1 focus:ring-navy focus:border-navy w-full bg-white !important;
}
.fluentform.ff-default .ff-btn-submit {
  @apply w-full bg-navy border-2 border-gold text-white px-8 py-4 rounded hover:bg-[#0a1b36] font-bold tracking-wide transition-all shadow-[0_0_15px_rgba(214,161,74,0.2)] !important;
}

/* Contact Page Dark Form Overrides */
.fire-contact-form-wrapper .fluentform form {
  @apply grid grid-cols-1 md:grid-cols-2 gap-x-6 gap-y-4 !important;
}
.fire-contact-form-wrapper .fluentform .ff-el-group {
  @apply mb-0 !important;
}
.fire-contact-form-wrapper .fluentform .ff-el-group.ff-el-is-textarea,
.fire-contact-form-wrapper .fluentform .ff-el-group:has(input[type="file"]),
.fire-contact-form-wrapper .fluentform .ff-submit-btn-wrapper {
  @apply md:col-span-2 !important;
}
.fire-contact-form-wrapper .fluentform.ff-default .ff-el-input--label label {
  @apply text-xs text-[#d1d5db] mb-2 font-medium inline-block !important;
}
.fire-contact-form-wrapper .fluentform.ff-default .ff-el-form-control {
  @apply bg-[#1e293b] border-[#334155] rounded-lg text-sm text-[#fff] focus:border-gold focus:ring-0 !important;
}
.fire-contact-form-wrapper .fluentform.ff-default .ff-el-form-control::placeholder {
  @apply text-[#6b7280] !important;
}
.fire-contact-form-wrapper .fluentform.ff-default .ff-btn-submit {
  @apply bg-gold text-navy hover:bg-[#b08035] border-none px-10 py-4 rounded-lg font-bold text-sm shadow-none md:w-auto inline-flex items-center justify-center gap-2 !important;
}
.fire-contact-form-wrapper .fluentform.ff-default .ff-submit-btn-wrapper {
  @apply mt-2 text-left !important;
}
/* File upload styling */
.fire-contact-form-wrapper .fluentform.ff-default .ff-el-form-control[type="file"] {
  @apply p-6 border-2 border-dashed text-center h-auto hover:border-gold transition-colors cursor-pointer bg-[#1e293b]/50 !important;
}

/* --- ANIMATIONS --- */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

.animate-marquee {
  animation: marquee 25s linear infinite;
  will-change: transform;
}

.animate-marquee:hover {
  animation-play-state: paused;
}

/* Utilities */
.scrollbar-hide {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.scrollbar-hide::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}

/* --- POST CONTENT STYLING (For single.php) --- */
.post-content {
  @apply text-lg leading-relaxed text-gray-700;
}
.post-content > *:first-child { @apply mt-0; }
.post-content p { @apply mb-6; }
.post-content h2 { @apply text-3xl font-bold text-navy mt-12 mb-6 font-heading leading-tight; }
.post-content h3 { @apply text-2xl font-bold text-navy mt-10 mb-4 font-heading leading-tight; }
.post-content h4 { @apply text-xl font-bold text-navy mt-8 mb-4 font-heading leading-snug; }
.post-content h5, .post-content h6 { @apply font-bold text-navy mt-6 mb-3 font-heading; }
.post-content ul { @apply list-disc pl-6 mb-6 space-y-2; }
.post-content ol { @apply list-decimal pl-6 mb-6 space-y-2; }
.post-content li { @apply mb-2; }
.post-content blockquote { @apply border-l-4 border-gold pl-6 py-2 my-8 italic text-gray-600 bg-gray-50 rounded-r-lg; }
.post-content blockquote p:last-child { @apply mb-0; }
.post-content img { @apply rounded-xl max-w-full h-auto my-8 shadow-sm border border-gray-100; }
.post-content a { @apply text-gold hover:text-navy hover:underline font-semibold transition-colors; }
.post-content figure { @apply my-8; }
.post-content figcaption { @apply text-center text-sm text-gray-500 mt-3; }
.post-content iframe { @apply w-full rounded-xl my-8 aspect-video; }
.post-content table { @apply w-full mb-8 border-collapse border border-gray-200 text-sm; }
.post-content th, .post-content td { @apply border border-gray-200 p-3 text-left; }
.post-content th { @apply bg-gray-50 font-bold text-navy; }