/* ============================================
   LANDING PAGE - GIA CÔNG SƠN HÀ NỘI
   Complete CSS Styles
   ============================================ */

/* Fix Elementor Container Width - Make it Full Width */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 100% !important;
}

.elementor-container {
  max-width: 100% !important;
}

/* Override WordPress/Elementor default narrow width */
body .elementor-widget-html {
  width: 100%;
  max-width: 100%;
}

/* Ensure landing page content is full width */
.landing-page-wrapper,
.landing-page-content {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* Fix for Elementor's default padding */
.elementor-section-wrap {
  width: 100%;
}

/* Material Icons Configuration */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Glass Card Effect */
.gcsh-glass-card {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* Signature Gradient Background */
.gcsh-bg-signature-gradient {
  background: linear-gradient(135deg, #0050cd 0%, #0866ff 100%);
}

/* Tonal Shift Animation */
.gcsh-tonal-shift {
  transition: background-color 0.3s ease;
}

/* Industrial Pattern Background */
.gcsh-industrial-pattern {
  background-image: radial-gradient(circle, #e2e2e6 1px, transparent 1px);
  background-size: 30px 30px;
}

/* Service Card Shadow */
.gcsh-service-card-shadow {
  box-shadow: 0 40px 80px -20px rgba(0, 80, 205, 0.12);
}

/* Fix Long URL/Link Overflow on Mobile */
.text-xl a,
.text-lg a,
a[href^="http"],
a[href^="https"] {
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Specific fix for contact section links */
.box-social a,
.contact-link {
  word-break: break-all;
  overflow-wrap: anywhere;
  display: inline-block;
  max-width: 100%;
}

/* Smooth Scroll */
html.scroll-smooth {
  scroll-behavior: smooth;
}

/* Prevent Horizontal Overflow */
body.overflow-x-hidden {
  overflow-x: hidden;
}

/* Additional Utility Classes for Landing Page */
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.hover\:scale-95:hover {
  transform: scale(0.95);
}

.hover\:scale-105:hover {
  transform: scale(1.05);
}

.hover\:scale-\[1\.02\]:hover {
  transform: scale(1.02);
}

.hover\:shadow-lg:hover {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.hover\:shadow-\[0_20px_40px_rgba\(0\,80\,205\,0\.1\)\]:hover {
  box-shadow: 0 20px 40px rgba(0, 80, 205, 0.1);
}

/* Group Hover Effects */
.group:hover .group-hover\:scale-110 {
  transform: scale(1.1);
}

.group:hover .group-hover\:scale-\[1\.02\] {
  transform: scale(1.02);
}

.group:hover .group-hover\:text-primary {
  color: #0050cd;
}

.group:hover .group-hover\:border-primary\/30 {
  border-color: rgba(0, 80, 205, 0.3);
}

.group:hover .group-hover\:text-primary\/5 {
  color: rgba(0, 80, 205, 0.05);
}

.group:hover .group-hover\:gap-5 {
  gap: 1.25rem;
}

/* Backdrop Blur */
.backdrop-blur-md {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.backdrop-blur-3xl {
  backdrop-filter: blur(64px);
  -webkit-backdrop-filter: blur(64px);
}

/* Custom Animations */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fadeIn {
  animation: fadeIn 0.6s ease-out;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .gcsh-service-card-shadow {
    box-shadow: 0 20px 40px -10px rgba(0, 80, 205, 0.12);
  }
}

/* Fix for Elementor Conflicts */
.elementor-widget-container .gcsh-glass-card,
.elementor-widget-container .gcsh-bg-signature-gradient,
.elementor-widget-container .gcsh-industrial-pattern {
  width: 100%;
}

/* Ensure Material Icons Display Correctly */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
