body { box-sizing: border-box; }

:root {
  --primary-gold: #FFD700;
  --gold-light: #FFF8DC;
  --gold-dark: #DAA520;
  --deep-blue: #0B1426;
  --soft-blue: #1E3A8A;
  --comfort-green: #10B981;
  --warm-gray: #F7FAFC;
  --wpp-default-green: #25D366;
  --wpp-medium-green: #128C7E;
  --wpp-dark-green: #075E54;
  --wpp-light-green: #DCF8C6;
}

.scroll-reveal {opacity: 1 !important; transform: none !important; transition: none !important;}

.text-light-green {color: var(--wpp-light-green);}
.font-comfortaa { font-family: 'Comfortaa', cursive; }
.font-poppins { font-family: 'Poppins', sans-serif; }

@keyframes floatGentle { 0%,100%{transform:translateY(0) rotate(0)} 33%{transform:translateY(-8px) rotate(1deg)} 66%{transform:translateY(-4px) rotate(-1deg)} }
@keyframes slideInFromLeft { 0%{opacity:0;transform:translateX(-100px) scale(.8)} 100%{opacity:1;transform:translateX(0) scale(1)} }
@keyframes slideInFromRight { 0%{opacity:0;transform:translateX(100px) scale(.8)} 100%{opacity:1;transform:translateX(0) scale(1)} }
@keyframes fadeInScale { 0%{opacity:0;transform:scale(.5) rotate(10deg)} 100%{opacity:1;transform:scale(1) rotate(0)} }
@keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
@keyframes pulse3D { 0%,100%{transform:scale(1) rotateY(0)} 50%{transform:scale(1.05) rotateY(5deg)} }
@keyframes morphBackground {
  0%,100%{border-radius:60% 40% 30% 70% / 60% 30% 70% 40%}
  25%{border-radius:30% 60% 70% 40% / 50% 60% 30% 60%}
  50%{border-radius:50% 60% 30% 60% / 30% 60% 70% 40%}
  75%{border-radius:60% 40% 60% 30% / 40% 50% 60% 30%}
}

.logo img {height: 55px;}

.glass-luxury {
  background: linear-gradient(135deg, rgba(255,255,255,0.4), rgba(255,255,255,0.1));
  backdrop-filter: blur(30px);
  border: 1px solid rgba(255,255,255,0.3);
  box-shadow: 0 25px 45px rgba(0,0,0,0.1), inset 0 1px 0 rgba(255,255,255,0.6);
}

.glass-dark {
  background: linear-gradient(135deg, rgba(11,20,38,0.9), rgba(30,58,138,0.8));
  backdrop-filter: blur(25px);
  border: 1px solid rgba(255,215,0,0.3);
}

.bg-luxury-gradient { background: linear-gradient(135deg,#667eea 0%,#764ba2 25%,#f093fb 50%,#f5576c 75%,#4facfe 100%); }
.bg-comfort-gradient { background: linear-gradient(135deg,var(--comfort-green) 0%,#06D6A0 50%,#118AB2 100%); }
.bg-gold-gradient { background: linear-gradient(135deg,var(--primary-gold) 0%,#FFA500 50%,var(--gold-dark) 100%); }

.btn-luxury {
  position: relative; overflow:hidden; background: linear-gradient(135deg, var(--primary-gold), var(--gold-dark));
  border-radius: 50px; padding: 16px 32px; font-weight: 600; color: var(--deep-blue);
  transition: all .4s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 10px 30px rgba(255,215,0,.3), inset 0 1px 0 rgba(255,255,255,.6);
}
.btn-luxury::before {
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
  transition: left .6s;
}
.btn-luxury:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 20px 40px rgba(255,215,0,.4), inset 0 1px 0 rgba(255,255,255,.8); }
.btn-luxury:hover::before { left:100%; }
.btn-luxury.btn-luxury-wpp {
  background: linear-gradient(135deg, var(--wpp-medium-green), var(--wpp-dark-green));
  box-shadow: 0 10px 30px rgba(7,94,84,.3), inset 0 1px 0 rgba(255,255,255,.6);
  color: var(--wpp-light-green);
}

.comfort-card {
  background: linear-gradient(145deg, rgba(255,255,255,0.9), rgba(247,250,252,0.8));
  backdrop-filter: blur(20px);
  border-radius: 30px; padding: 2rem;
  border: 2px solid rgba(255,215,0,0.2);
  transition: all .5s cubic-bezier(.4,0,.2,1);
  position: relative; overflow: hidden;
}
.comfort-card::before {
  content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background: linear-gradient(45deg, transparent, rgba(255,215,0,0.1), transparent);
  transform: rotate(45deg); transition: all .6s; opacity:0;
}
.comfort-card:hover { transform: translateY(-15px) rotateX(5deg) rotateY(5deg); box-shadow: 0 30px 60px rgba(0,0,0,.15), 0 0 0 1px rgba(255,215,0,.3); }
.comfort-card:hover::before { opacity:1; transform: rotate(45deg) translate(50%,50%); }

.parallax-layer { position:absolute; width:100%; height:100%; }
.parallax-bg { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); animation: morphBackground 20s ease-in-out infinite; }

.fleet-showcase { perspective: 1000px; transform-style: preserve-3d; }
.fleet-card { background: linear-gradient(145deg, rgba(255,255,255,0.95), rgba(247,250,252,0.9)); backdrop-filter: blur(25px); border-radius: 25px; overflow:hidden; transition: all .6s cubic-bezier(.4,0,.2,1); border:1px solid rgba(255,215,0,0.3); }
.fleet-card:hover { transform: rotateY(10deg) rotateX(5deg) translateZ(50px); box-shadow: 0 40px 80px rgba(0,0,0,.2), 0 0 0 1px rgba(255,215,0,.4); }

.testimonial-slider { display:flex; transition: transform .8s cubic-bezier(.4,0,.2,1); }

.comfort-indicator {
  width:80px; height:80px; border-radius:50%;
  background: linear-gradient(135deg, var(--comfort-green), #06D6A0);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 15px 35px rgba(16,185,129,.3), inset 0 2px 0 rgba(255,255,255,.4);
  animation: pulse3D 3s ease-in-out infinite;
}

.text-shimmer {
  background: linear-gradient(90deg, var(--primary-gold), #FFA500, var(--primary-gold));
  background-size:200% 100%;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation: shimmer 3s ease-in-out infinite;
}

.scroll-reveal { opacity:0; transform: translateY(50px) scale(0.9); transition: all .8s cubic-bezier(.4,0,.2,1); }
.scroll-reveal.revealed { opacity:1; transform: translateY(0) scale(1); }

.floating-element { animation: floatGentle 6s ease-in-out infinite; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 12px; }
::-webkit-scrollbar-track { background: linear-gradient(135deg, #f1f5f9, #e2e8f0); border-radius:10px; }
::-webkit-scrollbar-thumb { background: linear-gradient(135deg, var(--primary-gold), var(--gold-dark)); border-radius:10px; border:2px solid #f1f5f9; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(135deg, var(--gold-dark), #B8860B); }

.loading-wave { display:inline-block; animation: wave 1.5s ease-in-out infinite; }
@keyframes wave { 0%,60%,100%{ transform: initial; } 30%{ transform: translateY(-15px); } }

/* Helper background for contact section */
.bg-gradient-dark { background: linear-gradient(135deg, #0b1426 0%, #1e3a8a 100%); }

.wpp-image-link {bottom:30px; position:fixed; right:35px; z-index:999;}
.wpp-image-link img {max-width:70px;}
.wpp-image-link::after, .wpp-image-link::before
{
	content: '';
	position: absolute;
	opacity: 0;
	border: 4px solid #25D366;
	left: -10px;
	top: -10px;
	right: -10px;
	bottom: -10px;
	-webkit-border-radius: 50%;
	animation: WaveWhatsApp 1.5s ease infinite;
}
.wpp-image-link::after {animation-delay:.5s}
@keyframes WaveWhatsApp 
{
	0% 		{transform:scale(.5);}
	50% 	{opacity:1;}
	100% 	{transform:scale(1.2); opacity:0;}
}

.the_content p, .the_content li, .the_content h1, .the_content h2, .the_content h3, .the_content h4, .the_content h5, .the_content h6 {padding-bottom: 15px;}
.the_content a {color: var(--soft-blue);}
.the_content h2 {font-weight: 900; font-size: 26px;}
.the_content ul {list-style: inside disc;}
.the_content ol {list-style: inside decimal;}
.the_content ul, .the_content ol {padding-left: 35px;}

@media (max-width:768px)
{
  .comfort-card { padding:1.5rem; border-radius:20px; }
  .fleet-card:hover { transform: translateY(-10px) scale(1.02); }
  .logo img {height: 40px;}
}