/* Home / Global Custom Animation Layer (Guideline-Based)
   Focus: Elegance, Trust, Global Sophistication
   All core motion durations <= 600ms (prefers-reduced-motion respected) */

:root {
  --easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --easing-emphasized: cubic-bezier(0.33, 1, 0.68, 1);
  --anim-fast: 180ms;
  --anim-medium: 360ms;
  --anim-slow: 520ms; /* < 600ms */
}

/* ================= Page Load (Hero) ================= */
.hero-intro { opacity: 0; transform: translateY(32px); }
.hero-intro.hero-loaded { opacity: 1; transform: translateY(0); transition: opacity var(--anim-slow) var(--easing-standard), transform var(--anim-slow) var(--easing-standard); }

/* Typewriter baseline (element just needs data-typewriter attribute; characters injected by JS) */
[data-typewriter] { white-space: nowrap; overflow: hidden; display: inline-block; }
[data-typewriter].tw-finished { border-right: none !important; }

/* ================= Navigation Shrink on Scroll ================= */
.fbs__net-navbar, .navbar { transition: height var(--anim-medium) var(--easing-standard), background-color var(--anim-medium) var(--easing-standard), box-shadow var(--anim-medium) var(--easing-standard), backdrop-filter var(--anim-medium) var(--easing-standard); height: 76px; }
.fbs__net-navbar.scrolled, .navbar.scrolled { height: 60px; background: rgba(255,255,255,0.85) !important; box-shadow: 0 4px 18px rgba(0,0,0,0.08); backdrop-filter: blur(14px); }
.fbs__net-navbar.scrolled .nav-link, .navbar.scrolled .nav-link { color: #052444 !important; }
.fbs__net-navbar.scrolled .nav-link.active { color: var(--secondary-gold) !important; }

/* ================= Section Reveal Alternating ================= */
.section-animate { opacity:0; transform: translateY(36px); transition: opacity var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-standard); }
.section-animate.in-view { opacity:1; transform: translateY(0); }
.section-animate-left { opacity:0; transform: translateX(-48px); transition: opacity var(--anim-medium) var(--easing-emphasized), transform var(--anim-medium) var(--easing-emphasized); }
.section-animate-left.in-view { opacity:1; transform: translateX(0); }
.section-animate-right { opacity:0; transform: translateX(48px); transition: opacity var(--anim-medium) var(--easing-emphasized), transform var(--anim-medium) var(--easing-emphasized); }
.section-animate-right.in-view { opacity:1; transform: translateX(0); }

/* ================= CTA Buttons ================= */
.btn-enhanced, .btn.btn-enhanced { position: relative; transition: background-color var(--anim-fast) var(--easing-standard), color var(--anim-fast) var(--easing-standard), transform var(--anim-medium) var(--easing-emphasized), box-shadow var(--anim-medium) var(--easing-standard); }
.btn-enhanced:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 10px 24px -6px rgba(0,0,0,0.20); }
.btn-enhanced:active { transform: scale(0.96); }
.btn-enhanced:focus-visible { outline: 2px solid var(--secondary-gold); outline-offset: 3px; }

/* Ripple (fallback if JS adds .ripple-span) */
.btn-enhanced .ripple-span { position:absolute; border-radius:50%; transform:scale(0); background:rgba(255,255,255,.45); animation:ripple-expand 520ms var(--easing-standard); pointer-events:none; }
@keyframes ripple-expand { to { transform:scale(8); opacity:0; } }

/* ================= Destination Cards ================= */
.destination-card { position:relative; border-radius:20px; overflow:hidden; background:#fff; box-shadow:0 8px 32px -12px rgba(5,36,68,0.25); transition: box-shadow var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-standard); }
.destination-card:hover { box-shadow:0 18px 48px -10px rgba(5,36,68,0.35); transform:translateY(-6px); }
.destination-card .destination-image { position:relative; overflow:hidden; }
.destination-card .destination-image img { width:100%; height:auto; display:block; transform:scale(1); transition: transform var(--anim-slow) var(--easing-emphasized), filter var(--anim-medium) var(--easing-standard); }
.destination-card:hover .destination-image img { transform:scale(1.08); filter:brightness(1.05) saturate(1.05); }
.destination-card .destination-overlay { position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,36,68,0) 0%, rgba(5,36,68,0.72) 100%); display:flex; align-items:flex-end; padding:1.25rem; transform:translateY(35%); transition: transform var(--anim-medium) var(--easing-standard); }
.destination-card:hover .destination-overlay { transform:translateY(0); }
.destination-card .destination-info { transform:translateY(12px); opacity:0; transition: opacity var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-standard); }
.destination-card:hover .destination-info { opacity:1; transform:translateY(0); }

/* ================= Testimonial Carousel (Crossfade) ================= */
.testimonial-carousel { position:relative; overflow:hidden; }
.testimonial-carousel .carousel-slide { position:absolute; inset:0; opacity:0; transform:translateX(12px); transition: opacity var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-standard); }
.testimonial-carousel .carousel-slide.active { opacity:1; transform:translateX(0); position:relative; }
.carousel-controls button { background:rgba(255,255,255,0.85); border:none; width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px -4px rgba(0,0,0,0.28); transition: background-color var(--anim-fast) var(--easing-standard), transform var(--anim-fast) var(--easing-standard); }
.carousel-controls button:hover { background:#fff; transform:scale(1.08); }
.carousel-controls button:active { transform:scale(0.92); }

/* ================= Footer Reveal ================= */
footer { opacity:0; transform:translateY(40px); transition: opacity var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-standard); }
footer.footer-visible { opacity:1; transform:translateY(0); }
footer.footer-visible .footer-icon { animation: footerIconSlide var(--anim-medium) var(--easing-emphasized); }
@keyframes footerIconSlide { from { opacity:0; transform:translateX(28px); } to { opacity:1; transform:translateX(0); } }

/* ================= Stats Section Enhanced Flow ================= */
.stats-metrics .stat-item { opacity:0; transform:translateY(24px) scale(.94); transition: opacity var(--anim-medium) var(--easing-standard), transform var(--anim-medium) var(--easing-emphasized); will-change: transform, opacity; }
.section-animate.in-view .stats-metrics .stat-item { opacity:1; transform:translateY(0) scale(1); }
.section-animate.in-view .stats-metrics .stat-item:nth-child(1) { transition-delay: 40ms; }
.section-animate.in-view .stats-metrics .stat-item:nth-child(2) { transition-delay: 120ms; }
.section-animate.in-view .stats-metrics .stat-item:nth-child(3) { transition-delay: 200ms; }
.section-animate.in-view .stats-metrics .stat-item:nth-child(4) { transition-delay: 280ms; }
.stats-metrics .stat-item:hover { transform:translateY(-4px) scale(1.02); }

/* ================= Impact Metrics Overhaul ================= */
#corporate-impact { --metric-bg: rgba(255,255,255,0.04); --metric-border: rgba(255,255,255,0.12); }
#corporate-impact .impact-heading { position:relative; padding-left:0.25rem; }
#corporate-impact .impact-heading:after { content:''; position:absolute; left:0; bottom:-8px; width:72px; height:3px; background:linear-gradient(90deg,var(--secondary-gold),rgba(255,255,255,0)); border-radius:3px; animation: impactBar 3s linear infinite; }
@keyframes impactBar { 0%{transform:translateX(0);} 50%{transform:translateX(12px);} 100%{transform:translateX(0);} }

#corporate-impact .impact-metrics { --delay-step:90ms; }
#corporate-impact .impact-metric { position:relative; perspective:1000px; }
#corporate-impact .impact-metric .metric-shell { background:var(--metric-bg); border:1px solid var(--metric-border); border-radius:18px; padding:1.25rem 1rem 1.15rem; backdrop-filter:blur(6px); box-shadow:0 8px 28px -10px rgba(0,0,0,0.35); transform:translateY(24px) scale(.95) rotateX(8deg); opacity:0; transition:transform 520ms var(--easing-emphasized), opacity 420ms var(--easing-standard), box-shadow 360ms var(--easing-standard); }

.section-animate.in-view #corporate-impact .impact-metric .metric-shell, #corporate-impact .impact-metric.revealed .metric-shell { opacity:1; transform:translateY(0) scale(1) rotateX(0deg); }
#corporate-impact .impact-metric[data-metric-index="0"] .metric-shell { transition-delay: calc(var(--delay-step) * 0); }
#corporate-impact .impact-metric[data-metric-index="1"] .metric-shell { transition-delay: calc(var(--delay-step) * 1); }
#corporate-impact .impact-metric[data-metric-index="2"] .metric-shell { transition-delay: calc(var(--delay-step) * 2); }
#corporate-impact .impact-metric[data-metric-index="3"] .metric-shell { transition-delay: calc(var(--delay-step) * 3); }

#corporate-impact .metric-shell:hover { box-shadow:0 16px 42px -8px rgba(0,0,0,0.45); transform:translateY(-4px) scale(1.03) rotateX(0deg); }
#corporate-impact .metric-icon { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg,var(--secondary-gold),#b8852b); color:#052444; font-size:1.35rem; margin-bottom:.75rem; box-shadow:0 6px 18px -4px rgba(0,0,0,0.45); position:relative; overflow:hidden; }
#corporate-impact .metric-icon:after { content:''; position:absolute; inset:0; background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), rgba(255,255,255,0)); opacity:0; transition:opacity 420ms var(--easing-standard); }
#corporate-impact .metric-shell:hover .metric-icon:after { opacity:1; }

#corporate-impact .metric-value { font-size:2.3rem; font-weight:700; line-height:1; background:linear-gradient(45deg,var(--secondary-gold),#ffe199); -webkit-background-clip:text; -webkit-text-fill-color:transparent; filter:drop-shadow(0 0 12px rgba(230,173,0,0.35)); letter-spacing:1px; }
.metric-label { margin-top:.4rem; font-weight:500; }
.metric-accent { position:absolute; left:14px; top:14px; width:10px; height:10px; border-radius:50%; background:radial-gradient(circle,var(--secondary-gold) 0%, #ffd87a 60%, rgba(255,255,255,0) 70%); box-shadow:0 0 0 0 rgba(230,173,0,0.55); animation: metricPulse 3.6s ease-in-out infinite; }
@keyframes metricPulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 0 rgba(230,173,0,0.45);} 50% { transform:scale(1.3); box-shadow:0 0 0 12px rgba(230,173,0,0); } }

/* Count up (CSS fallback no-JS) */
.metric-value.counting { animation: valueFlash 520ms var(--easing-standard); }
@keyframes valueFlash { 0%{filter:brightness(.6);} 100%{filter:brightness(1);} }

/* Impact image overlay */
.impact-visual { overflow:hidden; border-radius:28px; box-shadow:0 40px 80px -30px rgba(0,0,0,0.55), 0 8px 24px -6px rgba(0,0,0,0.4); }
.impact-image { transform:scale(1.15); transition:transform 16000ms linear; }
#corporate-impact.in-view .impact-image { transform:scale(1); }
.impact-overlay-gradient { position:absolute; inset:0; background:linear-gradient(135deg, rgba(5,36,68,.65) 0%, rgba(5,36,68,0) 70%); pointer-events:none; mix-blend-mode:overlay; }

@media (max-width: 992px) { .metric-value { font-size:2rem; } }
@media (prefers-reduced-motion: reduce) { .impact-image { transition:none !important; } .metric-shell { transition:none !important; transform:none !important; opacity:1 !important; } }