/* ================================================
   إبداع الأعمال للمقاولات — Main Stylesheet
   ================================================ */

/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Cairo', 'Tajawal', sans-serif;
  background-color: #080808;
  color: #F8F3E8;
  overflow-x: hidden;
  direction: rtl;
  -webkit-font-smoothing: antialiased;
}

/* ===== CUSTOM SCROLLBAR ===== */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #080808; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #D4AF37, #0A3A20);
  border-radius: 3px;
}

/* ===== KEYFRAMES ===== */
@keyframes shimmer {
  0%   { background-position: -300% center; }
  100% { background-position:  300% center; }
}
@keyframes float {
  0%,100% { transform: translateY(0)    rotate(0deg); }
  33%      { transform: translateY(-18px) rotate(120deg); }
  66%      { transform: translateY(-8px)  rotate(240deg); }
}
@keyframes pulseGold {
  0%,100% { box-shadow: 0 0 0 0   rgba(212,175,55,0.6), 0 0 20px rgba(212,175,55,0.3); }
  50%      { box-shadow: 0 0 0 14px rgba(212,175,55,0),   0 0 40px rgba(212,175,55,0.5); }
}
@keyframes pulseWA {
  0%,100% { box-shadow: 0 0 0 0   rgba(37,211,102,0.6), 0 0 20px rgba(37,211,102,0.3); }
  50%      { box-shadow: 0 0 0 14px rgba(37,211,102,0),   0 0 40px rgba(37,211,102,0.5); }
}
@keyframes neonPulse {
  0%,100% { text-shadow: 0 0 10px rgba(212,175,55,0.4), 0 0 30px rgba(212,175,55,0.2); }
  50%      { text-shadow: 0 0 20px rgba(212,175,55,0.8), 0 0 60px rgba(212,175,55,0.4), 0 0 100px rgba(212,175,55,0.2); }
}
@keyframes borderGlow {
  0%,100% { border-color: rgba(212,175,55,0.3); box-shadow: 0 0 10px rgba(212,175,55,0.1) inset; }
  50%      { border-color: rgba(212,175,55,0.8); box-shadow: 0 0 25px rgba(212,175,55,0.3) inset, 0 0 15px rgba(212,175,55,0.2); }
}
@keyframes scanLine {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}
@keyframes orbFloat {
  0%,100% { transform: translate(0,0)    scale(1); }
  25%      { transform: translate(40px,-60px) scale(1.1); }
  50%      { transform: translate(-30px,-40px) scale(0.9); }
  75%      { transform: translate(-50px,30px)  scale(1.05); }
}
@keyframes bob {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
@keyframes waveText {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}
@keyframes waPulse {
  0%, 100% { box-shadow: 0 6px 25px rgba(37,211,102,0.5); }
  50%       { box-shadow: 0 6px 40px rgba(37,211,102,0.8), 0 0 0 12px rgba(37,211,102,0.1); }
}
@keyframes marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== GOLD SHIMMER TEXT ===== */
.gold-text {
  background: linear-gradient(90deg,
    #7A5A00 0%, #B8941E 15%, #D4AF37 30%,
    #F5E070 45%, #FAE97A 50%, #F5E070 55%,
    #D4AF37 70%, #B8941E 85%, #7A5A00 100%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 4s linear infinite;
}

/* ===== NEON GOLD ===== */
.neon-gold {
  color: #D4AF37;
  animation: neonPulse 3s ease-in-out infinite;
}

/* ===== GLASSMORPHISM ===== */
.glass {
  background: rgba(10,58,32,0.12);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(212,175,55,0.2);
}
.glass-dark {
  background: rgba(8,8,8,0.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(212,175,55,0.18);
}
.glass-premium {
  background: rgba(6,31,16,0.25);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(212,175,55,0.35);
  box-shadow: 0 8px 40px rgba(0,0,0,0.5), inset 0 1px 0 rgba(212,175,55,0.15);
}

/* ===== BUTTONS ===== */
.btn-gold {
  background: linear-gradient(135deg,
    #A07810 0%, #C8A020 20%, #D4AF37 40%,
    #F0D060 55%, #D4AF37 70%, #B8941E 85%, #A07810 100%);
  background-size: 250% auto;
  color: #061f10;
  font-weight: 800;
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(212,175,55,0.35), 0 0 0 1px rgba(212,175,55,0.3);
}
.btn-gold::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
  transition: left 0.5s ease;
}
.btn-gold:hover::before { left: 100%; }
.btn-gold:hover {
  background-position: right center;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 35px rgba(212,175,55,0.6), 0 0 60px rgba(212,175,55,0.25);
}

.btn-emerald {
  background: linear-gradient(135deg, #061f10, #0A3A20, #145E34);
  color: #D4AF37;
  border: 1px solid rgba(212,175,55,0.5);
  transition: all 0.4s ease;
  box-shadow: 0 4px 20px rgba(10,58,32,0.4), 0 0 15px rgba(212,175,55,0.1);
}
.btn-emerald:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 35px rgba(10,58,32,0.6), 0 0 30px rgba(212,175,55,0.25);
  border-color: rgba(212,175,55,0.9);
}

.btn-whatsapp {
  background: linear-gradient(135deg, #1a9e55, #25D366, #128C7E);
  background-size: 200% auto;
  color: white;
  transition: all 0.4s ease;
  box-shadow: 0 4px 20px rgba(37,211,102,0.3), 0 0 0 1px rgba(37,211,102,0.2);
}
.btn-whatsapp:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 35px rgba(37,211,102,0.5), 0 0 60px rgba(37,211,102,0.2);
  background-position: right center;
}

.btn-phone {
  background: linear-gradient(135deg, #061f10, #0A3A20, #1a5c34);
  color: #D4AF37;
  border: 2px solid rgba(212,175,55,0.7);
  transition: all 0.4s ease;
  animation: pulseGold 2.5s ease-in-out infinite;
}
.btn-phone:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 35px rgba(212,175,55,0.6), 0 0 60px rgba(212,175,55,0.25);
  border-color: #D4AF37;
}

/* Hero WhatsApp button pulsing animation */
.btn-whatsapp-hero {
  animation: pulseWA 2.5s ease-in-out infinite;
}

/* ===== NAVBAR ===== */
#navbar { transition: all 0.4s ease; }
#navbar.scrolled {
  background: rgba(6,6,6,0.97) !important;
  box-shadow: 0 4px 40px rgba(212,175,55,0.12), 0 1px 0 rgba(212,175,55,0.2);
}

/* ===== NAV LINK ===== */
.nav-link {
  position: relative;
  padding-bottom: 4px;
  transition: color 0.3s ease;
  color: rgba(248,243,232,0.75);
  text-decoration: none;
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0; right: 0;
  width: 0; height: 2px;
  background: linear-gradient(90deg, transparent, #D4AF37, transparent);
  transition: width 0.35s ease;
}
.nav-link:hover { color: #D4AF37; text-shadow: 0 0 12px rgba(212,175,55,0.5); }
.nav-link:hover::after { width: 100%; }

/* ===== NAVBAR LOGO CIRCLE ===== */
.navbar-logo-circle {
  border-color: rgba(212,175,55,0.7);
  box-shadow: 0 0 20px rgba(212,175,55,0.3), 0 0 40px rgba(212,175,55,0.1);
}
.navbar-logo-inner {
  background: linear-gradient(135deg, #061f10, #0A3A20, #145E34);
}

/* ===== HAMBURGER BUTTON ===== */
.hamburger-btn {
  border: 1px solid rgba(212,175,55,0.35);
  box-shadow: 0 0 12px rgba(212,175,55,0.1);
}
.hamburger-line {
  background: #D4AF37;
}

/* ===== MOBILE MENU ICON COLORS ===== */
.menu-icon-gold { color: #D4AF37; width: 18px; }

/* ===== HERO SECTION ===== */
.hero-bg {
  background:
    linear-gradient(160deg, rgba(6,31,16,0.92) 0%, rgba(8,8,8,0.80) 45%, rgba(10,42,22,0.90) 100%),
    url('images/hero_bg.png') center/cover no-repeat scroll;
}

/* ===== HERO ORB ===== */
.hero-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  animation: orbFloat 12s ease-in-out infinite;
  will-change: transform;
}
.hero-orb-1 { background: radial-gradient(circle, rgba(10,58,32,0.6) 0%, transparent 70%); top: 10%; right: -5%; animation-delay: 0s; }
.hero-orb-2 { background: radial-gradient(circle, rgba(212,175,55,0.12) 0%, transparent 70%); bottom: 15%; left: 5%; animation-delay: 3s; }
.hero-orb-3 { background: radial-gradient(circle, rgba(10,58,32,0.5) 0%, transparent 70%); top: 50%; left: 20%; animation-delay: 6s; }

/* ===== SCAN LINE ===== */
.scan-line {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,0.3), transparent);
  animation: scanLine 8s linear infinite;
  pointer-events: none;
}

/* ===== PARTICLES ===== */
.particle {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  animation: bob 8s ease-in-out infinite;
}
.particle-1  { width:8px;  height:8px;  background:rgba(212,175,55,0.4); top:12%; right:8%;  animation-delay:0s;  animation-duration:9s;  box-shadow:0 0 8px  rgba(212,175,55,0.6); }
.particle-2  { width:12px; height:12px; background:rgba(212,175,55,0.25);top:65%; right:88%; animation-delay:2s;  animation-duration:11s; box-shadow:0 0 10px rgba(212,175,55,0.4); }
.particle-3  { width:6px;  height:6px;  background:rgba(212,175,55,0.5); top:82%; right:22%; animation-delay:4s;  animation-duration:8s;  box-shadow:0 0 6px  rgba(212,175,55,0.7); }
.particle-4  { width:10px; height:10px; background:rgba(212,175,55,0.3); top:35%; right:72%; animation-delay:1s;  animation-duration:10s; box-shadow:0 0 8px  rgba(212,175,55,0.5); }
.particle-5  { width:16px; height:16px; background:rgba(10,58,32,0.5);   top:48%; right:48%; animation-delay:3s;  animation-duration:13s; box-shadow:0 0 15px rgba(10,58,32,0.8);  }
.particle-6  { width:4px;  height:4px;  background:rgba(212,175,55,0.6); top:20%; right:55%; animation-delay:5s;  animation-duration:7s;  box-shadow:0 0 5px  rgba(212,175,55,0.9); }

/* ===== HERO GOLD BORDER LINES ===== */
.hero-border-top,
.hero-border-bottom {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,0.6), transparent);
}
.hero-border-top    { top: 0; }
.hero-border-bottom { bottom: 0; }

/* ===== HERO LOGO CIRCLE ===== */
.hero-logo-circle {
  border: 4px solid #D4AF37;
  box-shadow: 0 0 40px rgba(212,175,55,0.5), 0 0 80px rgba(212,175,55,0.2), 0 0 120px rgba(212,175,55,0.08);
  animation: bob 4s ease-in-out infinite;
  will-change: transform;
}
.hero-logo-inner {
  background: linear-gradient(135deg, #061f10, #0A3A20, #145E34);
}

/* ===== HERO HEADLINE SHADOW ===== */
.hero-headline-shadow { text-shadow: 0 4px 30px rgba(0,0,0,0.8); }

/* ===== HERO TAGLINE SHADOW ===== */
.hero-tagline-shadow { text-shadow: 0 2px 10px rgba(0,0,0,0.6); }

/* ===== HERO CITY LIST COLOR ===== */
.hero-cities { color: rgba(212,175,55,0.7); }

/* ===== SCROLL INDICATOR ===== */
.scroll-indicator {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #6b7280;
  font-size: 0.75rem;
  cursor: pointer;
  animation: float 2.5s ease-in-out infinite;
}
.scroll-indicator-icon { color: #D4AF37; font-size: 1rem; }

/* ===== SECTION BADGE ===== */
.section-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(212,175,55,0.08);
  border: 1px solid rgba(212,175,55,0.4);
  color: #D4AF37;
  padding: 6px 20px;
  border-radius: 50px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 0 20px rgba(212,175,55,0.1), inset 0 1px 0 rgba(212,175,55,0.15);
  animation: borderGlow 3s ease-in-out infinite;
}

/* ===== GOLD DIVIDER LINE ===== */
.gold-line {
  width: 90px;
  height: 3px;
  background: linear-gradient(90deg, transparent, #D4AF37, #F5E070, #D4AF37, transparent);
  border-radius: 2px;
  box-shadow: 0 0 12px rgba(212,175,55,0.5);
}
.section-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,0.5), transparent);
}

/* ===== SECTION BACKGROUNDS ===== */
.bg-services  { background: linear-gradient(180deg, #080808 0%, #0d1a0f 40%, #080808 100%); }
.bg-why-us    { background: linear-gradient(180deg, #080808 0%, #060f09 50%, #080808 100%); }
.bg-stats     { background: linear-gradient(135deg, #061f10 0%, #080808 40%, #061f10 100%); }
.bg-coverage  { background: linear-gradient(180deg, #080808 0%, #0a1208 50%, #080808 100%); }
.bg-contact   { background: linear-gradient(160deg, #061f10 0%, #080808 50%, #061f10 100%); }

/* ===== DECORATIVE SECTION ORBS ===== */
.section-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.section-orb-tl { top: 0;    right: 0;  width: 24rem; height: 24rem; background: radial-gradient(circle, rgba(10,58,32,0.35) 0%, transparent 70%); }
.section-orb-bl { bottom: 0; left: 0;   width: 24rem; height: 24rem; background: radial-gradient(circle, rgba(212,175,55,0.06) 0%, transparent 70%); }
.stats-radial   { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at center, rgba(212,175,55,0.05) 0%, transparent 70%); }
.contact-radial { position: absolute; inset: 0; pointer-events: none; }
.contact-radial-inner {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; height: 100%; max-width: 48rem;
  background: radial-gradient(ellipse at center, rgba(212,175,55,0.07) 0%, transparent 70%);
}

/* ===== REVEAL ANIMATION ===== */
.reveal {
  opacity: 0;
  transform: translateY(45px);
  transition: opacity 0.85s cubic-bezier(0.25,0.46,0.45,0.94),
              transform 0.85s cubic-bezier(0.25,0.46,0.45,0.94);
  will-change: transform, opacity;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ===== SERVICE CARD ===== */
.service-card {
  background: linear-gradient(145deg, #111111, #181818);
  border: 1px solid rgba(212,175,55,0.12);
  transition: all 0.5s cubic-bezier(0.25,0.46,0.45,0.94);
  position: relative;
  overflow: hidden;
}
.service-card::before {
  content: '';
  position: absolute;
  top: -1px; right: -1px; left: -1px;
  height: 3px;
  background: linear-gradient(90deg, transparent, #D4AF37, #F5E070, #D4AF37, transparent);
  opacity: 0;
  transition: opacity 0.4s ease;
  border-radius: 1rem 1rem 0 0;
  pointer-events: none;
}
.service-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top right, rgba(212,175,55,0.06) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}
.service-card:hover {
  transform: translateY(-12px) scale(1.01);
  border-color: rgba(212,175,55,0.55);
  box-shadow:
    0 30px 60px rgba(0,0,0,0.6),
    0 0 0 1px rgba(212,175,55,0.2),
    0 0 40px rgba(212,175,55,0.12);
}
.service-card:hover::before { opacity: 1; }
.service-card:hover::after  { opacity: 1; }

/* ===== SERVICE IMAGE WRAPPER ===== */
.service-img-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 0.875rem;
}
.service-img-wrap img {
  transition: transform 0.65s cubic-bezier(0.25,0.46,0.45,0.94), filter 0.5s ease;
  width: 100%; height: 185px;
  object-fit: cover;
  filter: brightness(0.85) saturate(0.9);
}
.service-card:hover .service-img-wrap img {
  transform: scale(1.09);
  filter: brightness(1) saturate(1.1);
}
.service-img-placeholder {
  width: 100%; height: 185px;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 8px;
}

/* ===== IMAGE LABEL ===== */
.img-label {
  position: absolute;
  bottom: 8px; right: 8px;
  background: rgba(6,31,16,0.92);
  border: 1px solid rgba(212,175,55,0.6);
  color: #D4AF37;
  font-size: 0.62rem;
  font-weight: 700;
  padding: 2px 9px;
  border-radius: 4px;
  box-shadow: 0 0 8px rgba(212,175,55,0.3);
}

/* ===== SERVICE ICON BOX ===== */
.service-icon-box {
  width: 50px; height: 50px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  background: linear-gradient(135deg, #061f10, #0A3A20, #145E34);
  border: 1px solid rgba(212,175,55,0.4);
  box-shadow: 0 0 20px rgba(212,175,55,0.15), inset 0 1px 0 rgba(212,175,55,0.1);
  transition: all 0.4s ease;
}
.service-card:hover .service-icon-box {
  box-shadow: 0 0 30px rgba(212,175,55,0.35), inset 0 1px 0 rgba(212,175,55,0.2);
  transform: rotate(5deg) scale(1.05);
}
.service-icon-gold { color: #D4AF37; font-size: 1.3rem; }

/* ===== SERVICE TAG ===== */
.service-tag {
  font-size: 0.62rem;
  padding: 3px 10px;
  border-radius: 50px;
  background: rgba(10,58,32,0.45);
  border: 1px solid rgba(212,175,55,0.2);
  color: rgba(212,175,55,0.85);
  transition: all 0.3s ease;
}
.service-card:hover .service-tag {
  background: rgba(10,58,32,0.7);
  border-color: rgba(212,175,55,0.45);
}

/* ===== WHY US CARD ===== */
.why-card {
  background: linear-gradient(145deg, rgba(10,58,32,0.18), rgba(8,8,8,0.95));
  border: 1px solid rgba(212,175,55,0.15);
  transition: all 0.45s ease;
}
.why-card:hover {
  transform: translateY(-8px);
  border-color: rgba(212,175,55,0.45);
  box-shadow: 0 20px 40px rgba(0,0,0,0.5), 0 0 25px rgba(212,175,55,0.1);
}
.why-icon-box {
  width: 64px; height: 64px;
  border-radius: 1rem;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1rem;
  background: linear-gradient(135deg, #061f10, #0A3A20);
  border: 1px solid rgba(212,175,55,0.4);
  box-shadow: 0 0 25px rgba(212,175,55,0.15);
}
.why-icon { color: #D4AF37; font-size: 1.6rem; }

/* ===== STATS CARD ===== */
.stat-card {
  background: linear-gradient(145deg, rgba(10,58,32,0.3), rgba(8,8,8,0.97));
  border: 1px solid rgba(212,175,55,0.22);
  transition: all 0.45s ease;
  position: relative; overflow: hidden;
}
.stat-card::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, #D4AF37, transparent);
  opacity: 0;
  transition: opacity 0.4s ease;
}
.stat-card:hover { transform: scale(1.06); border-color: #D4AF37; box-shadow: 0 20px 50px rgba(212,175,55,0.22); }
.stat-card:hover::before { opacity: 1; }

/* ===== REGION CARD ===== */
.region-card {
  background: linear-gradient(145deg, rgba(10,58,32,0.2), rgba(8,8,8,0.92));
  border: 1px solid rgba(212,175,55,0.18);
  transition: all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);
  position: relative; overflow: hidden;
}
.region-card::before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 3px; height: 0%;
  background: linear-gradient(180deg, #D4AF37, #0A3A20);
  transition: height 0.4s ease;
}
.region-card:hover::before { height: 100%; }
.region-card:hover {
  transform: translateY(-7px);
  border-color: rgba(212,175,55,0.55);
  box-shadow: 0 20px 40px rgba(10,58,32,0.45), 0 0 20px rgba(212,175,55,0.1);
}

/* Region CTA card variant */
.region-card-cta {
  border-color: rgba(212,175,55,0.35);
  background: linear-gradient(145deg, rgba(10,58,32,0.4), rgba(8,8,8,0.95));
}

/* ===== REGION ICON BOX ===== */
.region-icon-box {
  width: 40px; height: 40px;
  border-radius: 0.75rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  background: linear-gradient(135deg, #061f10, #0A3A20);
  border: 1px solid rgba(212,175,55,0.35);
}
.region-icon-gold { color: #D4AF37; }

/* Region CTA icon box (gold background) */
.region-cta-icon-box {
  width: 40px; height: 40px;
  border-radius: 0.75rem;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1rem;
  background: linear-gradient(135deg, #D4AF37, #A07810);
  box-shadow: 0 0 20px rgba(212,175,55,0.4);
}
.region-cta-icon { color: #061f10; }

/* ===== CITY BADGE ===== */
.city-badge {
  display: inline-block;
  font-size: 0.7rem;
  padding: 3px 10px;
  border-radius: 50px;
  background: rgba(212,175,55,0.07);
  border: 1px solid rgba(212,175,55,0.15);
  color: rgba(248,243,232,0.7);
  margin: 2px;
  transition: all 0.3s ease;
}
.city-badge:hover {
  background: rgba(212,175,55,0.15);
  border-color: rgba(212,175,55,0.4);
  color: #D4AF37;
}

/* ===== TESTIMONIALS ===== */
.testimonial-track { display: flex; transition: transform 0.7s cubic-bezier(0.25,0.46,0.45,0.94); }
.testimonial-card {
  min-width: 100%;
  background: linear-gradient(145deg, rgba(10,58,32,0.18), rgba(8,8,8,0.93));
  border: 1px solid rgba(212,175,55,0.2);
  box-shadow: 0 0 40px rgba(0,0,0,0.4);
}
.stars { color: #D4AF37; letter-spacing: 3px; text-shadow: 0 0 10px rgba(212,175,55,0.6); }
.testimonial-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(212,175,55,0.3);
  border: 1px solid rgba(212,175,55,0.3);
  cursor: pointer; transition: all 0.3s ease;
}
.testimonial-dot.active {
  background: #D4AF37; width: 24px; border-radius: 4px;
  box-shadow: 0 0 10px rgba(212,175,55,0.6);
}

/* ===== SLIDER NAV BUTTONS ===== */
.slider-btn {
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.3s ease;
  z-index: 10;
  background: rgba(8,8,8,0.95);
  border: 1px solid rgba(212,175,55,0.4);
  box-shadow: 0 0 15px rgba(212,175,55,0.15);
  cursor: pointer;
}
.slider-btn:hover {
  box-shadow: 0 0 25px rgba(212,175,55,0.35);
  border-color: rgba(212,175,55,0.7);
}
.slider-btn-prev { right: -16px; }
.slider-btn-next { left: -16px; }
@media (min-width: 640px) {
  .slider-btn-prev { right: -24px; }
  .slider-btn-next { left: -24px; }
}
.slider-btn-icon { color: #D4AF37; }

/* ===== TESTIMONIAL AUTHOR AVATAR ===== */
.testimonial-avatar {
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; font-weight: 900;
  flex-shrink: 0;
  background: linear-gradient(135deg, #0A3A20, #145E34);
  border: 2px solid rgba(212,175,55,0.5);
  color: #D4AF37;
}

/* ===== CONTACT GLOW CARD ===== */
.contact-glow-card {
  background: linear-gradient(145deg, rgba(10,58,32,0.25), rgba(8,8,8,0.9));
  border: 1px solid rgba(212,175,55,0.3);
  box-shadow: 0 0 60px rgba(212,175,55,0.08), 0 0 120px rgba(10,58,32,0.2);
}
.contact-divider { border-top: 1px solid rgba(212,175,55,0.2); }

/* ===== PHONE NUMBER DISPLAY ===== */
.phone-number-display {
  font-variant-numeric: tabular-nums;
  letter-spacing: 3px;
  direction: ltr;
  display: inline-block;
}

/* ===== FOOTER ===== */
.footer-bg {
  background: linear-gradient(180deg, #040a06, #030503);
  border-top: 1px solid rgba(212,175,55,0.15);
}
.footer-logo-circle {
  background: linear-gradient(135deg, #061f10, #145E34);
  border: 2px solid rgba(212,175,55,0.5);
  box-shadow: 0 0 15px rgba(212,175,55,0.2);
}
.footer-divider { border-top: 1px solid rgba(212,175,55,0.12); }
.footer-link { transition: all 0.3s ease; position: relative; }
.footer-link::after {
  content: '';
  position: absolute;
  bottom: -2px; right: 0;
  width: 0; height: 1px;
  background: #D4AF37;
  transition: width 0.3s ease;
}
.footer-link:hover { color: #D4AF37; text-shadow: 0 0 8px rgba(212,175,55,0.4); }
.footer-link:hover::after { width: 100%; }

/* ===== FOOTER SOCIAL ICONS ===== */
.social-icon-wa {
  width: 40px; height: 40px;
  border-radius: 0.75rem;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.3s ease;
  background: rgba(37,211,102,0.15);
  border: 1px solid rgba(37,211,102,0.3);
}
.social-icon-wa:hover { transform: scale(1.1); background: rgba(37,211,102,0.25); }
.social-icon-wa i { color: #25D366; }

.social-icon-phone {
  width: 40px; height: 40px;
  border-radius: 0.75rem;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.3s ease;
  background: rgba(10,58,32,0.4);
  border: 1px solid rgba(212,175,55,0.3);
}
.social-icon-phone:hover { transform: scale(1.1); border-color: rgba(212,175,55,0.6); }
.social-icon-phone i { color: #D4AF37; }

/* ===== MOBILE CTA BAR ===== */
.mobile-cta-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 1000;
  padding: 10px 14px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom));
  background: rgba(6,6,6,0.97);
  border-top: 1px solid rgba(212,175,55,0.35);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 -10px 40px rgba(0,0,0,0.7), 0 -1px 0 rgba(212,175,55,0.2);
  display: none;
}
@media (max-width: 768px) {
  .mobile-cta-bar { display: block; }
  body { padding-bottom: 84px; }
}

/* ===== MOBILE MENU ===== */
#mobile-menu {
  transition: all 0.45s cubic-bezier(0.25,0.46,0.45,0.94);
  max-height: 0; overflow: hidden;
}
#mobile-menu.open { max-height: 600px; }
#menu-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.7);
  z-index: 39;
  backdrop-filter: blur(4px);
}
#menu-overlay.active { display: block; }

/* ===== BACK TO TOP ===== */
#back-to-top {
  position: fixed;
  bottom: 96px; left: 20px;
  z-index: 50;
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none;
  transition: all 0.4s ease;
  background: linear-gradient(135deg, #0A3A20, #145E34);
  border: 1px solid rgba(212,175,55,0.5);
  box-shadow: 0 0 20px rgba(212,175,55,0.25);
  cursor: pointer;
}
#back-to-top.visible { opacity: 1; pointer-events: auto; }
#back-to-top:hover { transform: translateY(-3px); box-shadow: 0 0 30px rgba(212,175,55,0.4); }
#back-to-top i { color: #D4AF37; }

/* ===== SCROLL PROGRESS BAR ===== */
#scroll-progress {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  background: linear-gradient(to right, #D4AF37, #0A3A20);
  z-index: 99999;
  width: 0%;
  transition: width 0.1s linear;
}

/* ===== ICON COLOR UTILITIES ===== */
.icon-gold { color: #D4AF37; }
.icon-wa   { color: #25D366; }

/* ===== HERO WORD WAVE ===== */
.hero-word { display: inline-block; animation: waveText 3s ease-in-out infinite; }
.hero-word:nth-child(2) { animation-delay: 0.2s; }
.hero-word:nth-child(3) { animation-delay: 0.4s; }

/* ===== ANIMATE MARQUEE ===== */
.animate-marquee {
  display: flex;
  width: max-content;
  animation: marquee 25s linear infinite;
}

/* ===== RESPONSIVE ===== */
@media (min-width: 769px) {
  .mobile-cta-bar { display: none !important; }
}

/* ===== PERFORMANCE OPTIMIZATION FOR MOBILE ===== */
@media (max-width: 768px) {
  .hero-orb {
    animation: none !important;
  }
  .scan-line {
    display: none !important;
  }
  .particle {
    display: none !important;
  }
  .hero-word {
    animation: none !important;
  }
}