:root {--primary: #0c2d62;--primary-light: #0c2d62;--primary-dark: #012052;--primary-glow: rgba(12, 45, 98, 0.2);--secondary: #f1f4f9;--secondary-light: #ffffff;--accent: #ffa800;--accent-light: #ffa800;--bg-dark: #f1f4f9;--bg-darker: #ffffff;--bg-blue: #f1f4f9;--text-light: #012052;--text-muted: #0c2d62;--text-dim: rgba(12, 45, 98, 0.7);--border-glass: rgba(12, 45, 98, 0.1);--border-primary: rgba(12, 45, 98, 0.2);--card-bg: #ffffff;}* {margin: 0;padding: 0;box-sizing: border-box;}html, body {overflow-x: hidden !important;width: 100%;max-width: 100vw;}html {scroll-behavior: smooth;}body {font-family: 'Inter', sans-serif;background: var(--bg-dark);color: var(--text-light);min-height: 100vh;position: relative;}body::before {display: none;}body::after {display: none;}h1, h2, h3, h4, h5, h6 {font-family: 'Poppins', sans-serif;}.loader {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #f1f4f9;display: flex;align-items: center;justify-content: center;z-index: 9999;transition: opacity 0.6s ease, visibility 0.6s ease;}.loader.hidden {opacity: 0;visibility: hidden;}.loader-content {text-align: center;}.loader-rings {position: relative;width: 80px;height: 80px;margin: 0 auto 20px;}.loader-ring {position: absolute;border: 2px solid transparent;border-radius: 50%;animation: spin 1.5s linear infinite;}.loader-ring:nth-child(1) {top: 0;left: 0;width: 80px;height: 80px;border-top-color: var(--primary);border-right-color: var(--primary);}.loader-ring:nth-child(2) {top: 10px;left: 10px;width: 60px;height: 60px;border-bottom-color: var(--accent);border-left-color: var(--accent);animation-direction: reverse;animation-duration: 1s;}.loader-ring:nth-child(3) {top: 20px;left: 20px;width: 40px;height: 40px;border-top-color: var(--primary-light);animation-duration: 0.8s;}@keyframes spin {to {transform: rotate(360deg);}}.loader-text {font-family: 'Poppins', sans-serif;font-weight: 700;font-size: 1.25rem;color: var(--primary);letter-spacing: 2px;}.loader-subtext {font-size: 0.75rem;color: var(--text-dim);margin-top: 8px;letter-spacing: 3px;}.glass {background: #ffffff;-webkit- border: 1px solid var(--border-glass);border-radius: 16px;}.glass-strong {background: rgba(15, 23, 42, 0.7);-webkit- border: 1px solid var(--border-glass);}.navbar {position: fixed;top: 0;left: 0;width: 100%;z-index: 1000;padding: 20px 0;transition: all 0.4s ease;}.navbar.scrolled {background: #ffffff;border-bottom: 1px solid var(--border-glass);padding: 12px 0;box-shadow: 0 4px 10px rgba(12, 45, 98, 0.08);}.nav-link {position: relative;color: var(--text-muted);font-size: 0.875rem;font-weight: 500;padding: 8px 0;transition: color 0.3s ease;}.nav-link::after {content: '';position: absolute;bottom: 0;left: 0;width: 0;height: 2px;background: var(--accent);transition: width 0.3s ease;}.nav-link:hover {color: var(--primary-light);}.nav-link:hover::after {width: 100%;}.nav-link.active {color: var(--primary-light);font-weight: 700;}.nav-link.active::after {width: 100%;}.mobile-nav-link.active {background: rgba(12, 45, 98, 0.05);color: var(--primary-light);font-weight: 700;border-right: 4px solid var(--accent);}.btn-primary {display: inline-flex;align-items: center;gap: 10px;background: var(--accent);color: #012052;padding: 14px 32px;border-radius: 12px;font-weight: 700;font-size: 0.95rem;border: 2px solid var(--accent);cursor: pointer;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 8px 20px rgba(255, 168, 0, 0.25);}.btn-primary::before {display: none;}.btn-primary:hover {transform: translateY(-4px);box-shadow: 0 12px 25px rgba(255, 168, 0, 0.4);background: #e69600;border-color: #e69600;}.btn-primary:hover::before {left: 100%;}.btn-secondary {display: inline-flex;align-items: center;gap: 10px;background: #ffffff;color: var(--primary);padding: 14px 32px;border-radius: 12px;font-weight: 700;font-size: 0.95rem;border: 2px solid rgba(12, 45, 98, 0.1);cursor: pointer;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 4px 15px rgba(12, 45, 98, 0.05);}.btn-secondary:hover {background: rgba(12, 45, 98, 0.02);border-color: var(--primary);transform: translateY(-4px);box-shadow: 0 8px 20px rgba(12, 45, 98, 0.1);}.hero {position: relative;min-height: 100vh;display: flex;align-items: center;padding: 120px 0 60px;overflow: hidden;}.hero-bg-slider {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;pointer-events: none;-webkit-mask-image: linear-gradient(to bottom, black 60%, transparent 100%);mask-image: linear-gradient(to bottom, black 60%, transparent 100%);}.hero-bg-slider .slide {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-size: cover;background-position: center;opacity: 0;animation: heroFade 50s infinite;}.slide-1 {background-image: url('image/hero_bg_slide1.webp');animation-delay: 0s !important;}.slide-2 {background-image: url('image/hero_bg_drone.webp');animation-delay: 10s !important;}.slide-3 {background-image: url('image/hero_bg_slide3.webp');animation-delay: 20s !important;}.slide-4 {background-image: url('image/hero_bg_slide4.webp');animation-delay: 30s !important;}.slide-5 {background-image: url('image/hero_bg_slide5.webp');animation-delay: 40s !important;}@keyframes heroFade {0% {opacity: 0;}4% {opacity: 0.15;}20% {opacity: 0.15;}24% {opacity: 0;}100% {opacity: 0;}}.hero-title {font-size: clamp(2rem, 4vw, 3rem);font-weight: 800;line-height: 1.2;letter-spacing: -0.01em;}.hero-title, .hero p {text-shadow: 0 0 10px rgba(255, 255, 255, 0.8), 0 0 20px rgba(255, 255, 255, 0.9);}.solid-text-primary {color: var(--primary-dark);font-weight: 900;position: relative;z-index: 1;}.solid-text-primary::after {content: '';position: absolute;bottom: 8px;left: 0;width: 100%;height: 12px;background: rgba(255, 168, 0, 0.4);z-index: -1;transform: skewX(-15deg);border-radius: 2px;}.hero-visual {position: relative;width: 100%;height: 540px;max-width: 560px;margin-left: auto;}.contour-map {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 85%;height: 85%;opacity: 0.4;z-index: 0;}.contour-path {fill: none;stroke: var(--primary);stroke-width: 1;opacity: 0.3;animation: contourPulse 4s ease-in-out infinite;}@keyframes contourPulse {0%, 100% {opacity: 0.2;}50% {opacity: 0.5;}}.drone-wrapper {position: absolute;top: 6%;left: 50%;transform: translateX(-50%);z-index: 2;display: flex;flex-direction: column;align-items: center;}.drone-icon {font-size: 2.5rem;color: var(--primary);animation: droneFloat 4s ease-in-out infinite;filter: drop-shadow(0 0 20px var(--primary-glow));}@keyframes droneFloat {0%, 100% {transform: translateY(0) rotate(-5deg);}50% {transform: translateY(-12px) rotate(5deg);}}.scanning-beam {position: absolute;top: 100%;left: 50%;transform: translateX(-50%);width: 2px;height: 80px;background: linear-gradient(to bottom, var(--primary), transparent);animation: scanBeam 3s ease-in-out infinite;}@keyframes scanBeam {0%, 100% {opacity: 0.3;height: 60px;}50% {opacity: 0.8;height: 100px;}}.gis-dashboard {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 260px;background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.03);border-radius: 20px;padding: 24px;box-shadow: 0 30px 60px rgba(12, 45, 98, 0.12);z-index: 3;animation: floatDashboard 6s ease-in-out infinite;}@keyframes floatDashboard {0%, 100% {transform: translate(-50%, -50%);}50% {transform: translate(-50%, -55%);}}.dashboard-bar {height: 6px;border-radius: 3px;background: rgba(255, 255, 255, 0.1);overflow: hidden;margin-top: 4px;}.dashboard-bar-fill {height: 100%;border-radius: 3px;background: var(--accent);}.stat-card {position: absolute;background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.03);border-radius: 20px;padding: 20px 24px;box-shadow: 0 20px 40px rgba(12, 45, 98, 0.08);z-index: 4;animation: floatCard 6s ease-in-out infinite;}.gis-dashboard {transition: box-shadow 0.3s ease, filter 0.3s ease;cursor: pointer;}.gis-dashboard:hover {box-shadow: 0 40px 80px rgba(12, 45, 98, 0.2);filter: brightness(1.02);}.stat-card {transition: box-shadow 0.3s ease, filter 0.3s ease;cursor: pointer;}.stat-card:hover {box-shadow: 0 30px 60px rgba(12, 45, 98, 0.15);filter: brightness(1.02);z-index: 10;}@keyframes floatCard {0%, 100% {transform: translateY(0);}50% {transform: translateY(-12px);}}.stat-tl {top: 0;left: 0;animation-delay: 0s;}.stat-tr {top: 0;right: 0;animation-delay: -1.5s;}.stat-bl {bottom: 0;left: 0;animation-delay: -3s;}.stat-br {bottom: 0;right: 0;animation-delay: -4.5s;}@media (max-width: 1024px) {.hero-visual {height: 480px;max-width: 500px;}}@media (max-width: 768px) {.hero-visual {height: 400px;max-width: 100%;}.gis-dashboard {transform-origin: center;transform: translate(-50%, -50%) scale(0.7);}.contour-map {width: 95%;height: 95%;}.stat-card {padding: 12px 14px;}.stat-card .stat-number {font-size: 1.25rem !important;}.stat-card .stat-label {font-size: 0.65rem !important;}.stat-card .stat-icon {width: 32px !important;height: 32px !important;font-size: 0.85rem !important;}.drone-icon {font-size: 1.75rem;}.scanning-beam {height: 50px;}}@media (max-width: 480px) {.hero-visual {height: 340px;.gis-dashboard {transform: translate(-50%, -50%) scale(0.5);}}.stat-card {padding: 10px 12px;}.stat-card .stat-number {font-size: 1rem !important;}.stat-card .stat-label {font-size: 0.6rem !important;}.stat-card .stat-icon {width: 24px !important;height: 24px !important;font-size: 0.7rem !important;margin-right: 6px;}}.section {position: relative;padding: 100px 0;z-index: 1;}.section-title {font-size: clamp(2rem, 4vw, 3rem);font-weight: 800;line-height: 1.2;letter-spacing: -0.02em;}.section-subtitle {color: var(--primary-light);font-size: 0.875rem;font-weight: 600;letter-spacing: 3px;text-transform: uppercase;margin-bottom: 12px;}.service-card {background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.04);border-radius: 24px;padding: 36px;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);position: relative;overflow: hidden;height: 100%;box-shadow: 0 10px 30px rgba(12, 45, 98, 0.03);}.service-card:hover {border-color: rgba(12, 45, 98, 0.1);transform: translateY(-8px);box-shadow: 0 25px 50px rgba(12, 45, 98, 0.08);border-left: 6px solid var(--accent);padding-left: 30px;}.service-icon {width: 56px;height: 56px;border-radius: 14px;background: rgba(12, 45, 98, 0.05);border: 1px solid var(--border-primary);display: flex;align-items: center;justify-content: center;font-size: 1.5rem;color: var(--primary);margin-bottom: 20px;transition: all 0.3s ease;}.service-card:hover .service-icon {background: var(--accent);color: #012052;transform: scale(1.1) rotate(-5deg);box-shadow: 0 8px 20px var(--primary-glow);}.learn-more {display: inline-flex;align-items: center;gap: 6px;color: var(--primary-light);font-size: 0.875rem;font-weight: 600;transition: gap 0.3s ease;}.service-card:hover .learn-more {gap: 12px;}.portfolio-item {position: relative;border-radius: 16px;overflow: hidden;cursor: pointer;transition: all 0.4s ease;}.portfolio-item img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.6s ease;}.portfolio-item:hover img {transform: scale(1.1);}.portfolio-overlay {position: absolute;inset: 0;background: rgba(1, 32, 82, 0.85);display: flex;flex-direction: column;justify-content: flex-end;padding: 24px;opacity: 0;transition: opacity 0.4s ease;}.portfolio-item:hover .portfolio-overlay {opacity: 1;}.portfolio-item:hover {box-shadow: 0 20px 40px rgba(12, 45, 98, 0.08), 0 0 30px rgba(12, 45, 98, 0.15);}.filter-btn {padding: 8px 20px;border-radius: 50px;font-size: 0.875rem;font-weight: 500;color: var(--text-muted);background: #ffffff;border: 1px solid var(--border-glass);cursor: pointer;transition: all 0.3s ease;}.filter-btn:hover {color: var(--primary-light);border-color: var(--border-primary);}.filter-btn.active {background: var(--accent), var(--primary-dark));color: #012052;border-color: transparent;box-shadow: 0 4px 15px var(--primary-glow);}.testimonial-slider-wrapper {position: relative;padding: 20px 60px;}@media (max-width: 768px) {.testimonial-slider-wrapper {padding: 20px 30px;}}.testimonial-slider-viewport {overflow: hidden;position: relative;border-radius: 24px;}.testimonial-track {display: flex;transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);will-change: transform;}.testimonial-slide {padding: 0 16px;box-sizing: border-box;}@media (max-width: 767px) {.testimonial-slide {flex: 0 0 100%;}}@media (min-width: 768px) and (max-width: 1023px) {.testimonial-slide {flex: 0 0 50%;}}@media (min-width: 1024px) {.testimonial-slide {flex: 0 0 33.3333%;}}.testimonial-card {background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.05);border-radius: 24px;padding: 40px;position: relative;overflow: hidden;height: 100%;display: flex;flex-direction: column;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 15px 35px rgba(12, 45, 98, 0.04);}.testimonial-card::before {content: '\201C';position: absolute;top: -10px;right: 20px;font-size: 14rem;font-family: 'Poppins', sans-serif;color: rgba(12, 45, 98, 0.04);line-height: 1;pointer-events: none;z-index: 0;transition: color 0.4s;}.testimonial-slide.active-focus .testimonial-card::before {color: rgba(255, 168, 0, 0.08);}.testimonial-card:hover {border-color: rgba(12, 45, 98, 0.1);transform: translateY(-8px);background: #ffffff;box-shadow: 0 25px 50px rgba(12, 45, 98, 0.1);}.slider-nav-btn {position: absolute;top: 50%;transform: translateY(-50%);width: 48px;height: 48px;border-radius: 50%;background: rgba(15, 23, 42, 0.9);border: 1px solid rgba(12, 45, 98, 0.2);color: #0c2d62;z-index: 10;cursor: pointer;transition: all 0.3s ease;display: flex;align-items: center;justify-content: center;font-size: 1.125rem;}.slider-nav-btn:hover {background: #0c2d62;color: white;border-color: #0c2d62;box-shadow: 0 4px 20px rgba(12, 45, 98, 0.4);}.slider-nav-btn:disabled {opacity: 0.3;cursor: not-allowed;background: rgba(15, 23, 42, 0.9);color: #0c2d62;border-color: rgba(12, 45, 98, 0.2);box-shadow: none;}.slider-nav-btn.prev {left: 0;}.slider-nav-btn.next {right: 0;}.slider-controls {display: flex;flex-direction: column;align-items: center;gap: 16px;margin-top: 40px;}.slider-progress-bar {width: 120px;height: 4px;background: rgba(255,255,255,0.1);border-radius: 2px;overflow: hidden;}.slider-progress-fill {height: 100%;width: 0%;background: var(--accent);border-radius: 2px;transition: width 0.1s linear;}.slider-dots {display: flex;gap: 8px;}.dot {width: 10px;height: 10px;border-radius: 50%;background: rgba(255, 255, 255, 0.15);border: none;cursor: pointer;transition: all 0.3s ease;padding: 0;}.dot:hover {background: rgba(12, 45, 98, 0.4);}.dot.active {width: 30px;border-radius: 5px;background: var(--accent);box-shadow: 0 2px 8px rgba(12, 45, 98, 0.4);}.form-input {width: 100%;background: #ffffff;border: 2px solid rgba(12, 45, 98, 0.1);border-radius: 12px;padding: 16px 20px;color: var(--primary-dark);font-size: 0.95rem;font-family: 'Inter', sans-serif;transition: all 0.3s ease;box-shadow: inset 0 2px 4px rgba(12, 45, 98, 0.02);}.form-input:focus {outline: none;border-color: var(--accent);background: #ffffff;box-shadow: 0 0 0 4px rgba(255, 168, 0, 0.15);}.form-input::placeholder {color: var(--text-dim);}.form-label {display: block;font-size: 0.8125rem;font-weight: 500;color: var(--text-muted);margin-bottom: 8px;}.form-error {color: #ef4444;font-size: 0.75rem;margin-top: 6px;display: none;}.form-error.show {display: block;}.whatsapp-float {position: fixed;bottom: 30px;right: 30px;width: 60px;height: 60px;background: #25D366;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 1.75rem;color: white;z-index: 999;box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);transition: all 0.3s ease;animation: pulseWA 2s infinite;}@keyframes pulseWA {0% {box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);}70% {box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);}100% {box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);}}.whatsapp-float:hover {transform: scale(1.1) rotate(10deg);}.back-to-top {position: fixed;bottom: 30px;left: 30px;width: 48px;height: 48px;background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.05);border-radius: 12px;display: flex;align-items: center;justify-content: center;color: var(--primary);z-index: 999;cursor: pointer;opacity: 0;visibility: hidden;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 10px 25px rgba(12, 45, 98, 0.1);}.back-to-top.show {opacity: 1;visibility: visible;}.back-to-top:hover {background: var(--accent);color: #012052;border-color: var(--accent);transform: translateY(-4px);box-shadow: 0 15px 30px rgba(255, 168, 0, 0.25);}.reveal {opacity: 0;transform: translateY(40px);transition: opacity 0.8s ease, transform 0.8s ease;}.reveal.active {opacity: 1;transform: translateY(0);}.mobile-menu {position: fixed;top: 0;right: -100%;width: 80%;max-width: 380px;height: 100vh;background: #f1f4f9;z-index: 1100;padding: 80px 30px 30px;transition: right 0.4s ease;overflow-y: auto;border-left: 1px solid var(--border-glass);}.mobile-menu.open {right: 0;}.menu-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(12, 45, 98, 0.08);z-index: 1050;opacity: 0;visibility: hidden;transition: all 0.3s ease;}.menu-overlay.open {opacity: 1;visibility: visible;}.mobile-nav-link {display: block;padding: 16px 0;font-size: 1.125rem;font-weight: 500;color: var(--text-light);border-bottom: 1px solid var(--border-glass);transition: all 0.3s ease;}.mobile-nav-link:hover {color: var(--primary-light);padding-left: 12px;}.trust-track {display: flex;gap: 60px;animation: scroll 30s linear infinite;width: max-content;}@keyframes scroll {0% {transform: translateX(0);}100% {transform: translateX(-50%);}}.trust-item {display: flex;align-items: center;gap: 12px;color: var(--text-muted);font-weight: 600;font-size: 1.125rem;white-space: nowrap;opacity: 0.6;transition: opacity 0.3s ease;}.trust-item:hover {opacity: 1;}.case-study-card {background: #ffffff;border: 1px solid var(--border-glass);border-radius: 20px;overflow: hidden;transition: all 0.4s ease;height: 100%;}.case-study-card:hover {border-color: var(--border-primary);transform: translateY(-6px);box-shadow: 0 20px 40px rgba(12, 45, 98, 0.08);}.blog-card {background: #ffffff;border: 1px solid var(--border-glass);border-radius: 16px;overflow: hidden;transition: all 0.4s ease;height: 100%;}.blog-card:hover {border-color: var(--border-primary);transform: translateY(-6px);box-shadow: 0 20px 40px rgba(12, 45, 98, 0.08);}.blog-card img {width: 100%;height: 200px;object-fit: cover;transition: transform 0.6s ease;}.blog-card:hover img {transform: scale(1.08);}.advantage-card {background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.04);border-radius: 24px;padding: 32px;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 15px 35px rgba(12, 45, 98, 0.03);}.advantage-card:hover {border-color: rgba(12, 45, 98, 0.1);transform: translateY(-8px);box-shadow: 0 25px 50px rgba(12, 45, 98, 0.08);border-left: 6px solid var(--accent);padding-left: 26px;}.advantage-icon {width: 48px;height: 48px;border-radius: 12px;background: linear-gradient(135deg, rgba(12, 45, 98, 0.15), rgba(12, 45, 98, 0.05));display: flex;align-items: center;justify-content: center;color: var(--primary-light);font-size: 1.25rem;margin-bottom: 16px;}.cta-section {background: #012052;border: 1px solid rgba(255,255,255,0.1);border-radius: 24px;padding: 60px;position: relative;overflow: hidden;box-shadow: 0 40px 80px rgba(1, 32, 82, 0.2);}.cta-section::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: radial-gradient(circle at top right, rgba(255, 168, 0, 0.15) 0%, transparent 60%), radial-gradient(circle at bottom left, rgba(37, 211, 102, 0.05) 0%, transparent 50%);z-index: 0;display: block !important;pointer-events: none;}.cta-pulse-btn {animation: ctaPulse 2s infinite;}@keyframes ctaPulse {0% {box-shadow: 0 0 0 0 rgba(255, 168, 0, 0.4);}70% {box-shadow: 0 0 0 20px rgba(255, 168, 0, 0);}100% {box-shadow: 0 0 0 0 rgba(255, 168, 0, 0);}}.footer-link {color: #f1f4f9;font-size: 0.875rem;transition: all 0.3s ease;display: inline-block;opacity: 0.8;}.footer-link:hover {color: var(--accent);transform: translateX(4px);opacity: 1;}.social-icon {width: 40px;height: 40px;border-radius: 10px;background: rgba(255, 255, 255, 0.1);border: 1px solid rgba(255, 255, 255, 0.05);display: flex;align-items: center;justify-content: center;color: #ffffff;transition: all 0.3s ease;}.social-icon:hover {background: var(--accent);color: #012052;border-color: var(--accent);transform: translateY(-3px);box-shadow: 0 8px 20px rgba(255, 168, 0, 0.2);}.toast {position: fixed;bottom: 100px;right: 30px;background: #ffffff;border: 1px solid rgba(12, 45, 98, 0.05);border-radius: 12px;padding: 16px 24px;color: var(--primary-dark);z-index: 2000;transform: translateX(400px);transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 15px 35px rgba(12, 45, 98, 0.1);font-weight: 500;border-left: 4px solid var(--accent);}.toast.show {transform: translateX(0);}::-webkit-scrollbar {width: 10px;}::-webkit-scrollbar-track {background: #f1f4f9;}::-webkit-scrollbar-thumb {background: rgba(12, 45, 98, 0.3);border-radius: 5px;}::-webkit-scrollbar-thumb:hover {background: rgba(12, 45, 98, 0.5);}::selection {background: var(--primary);color: white;}.watermark-number {position: absolute;font-family: 'Poppins', sans-serif;font-size: 14rem;font-weight: 900;color: rgba(12, 45, 98, 0.03);line-height: 1;z-index: 0;pointer-events: none;user-select: none;}.watermark-01 {top: -40px;right: 10%;}.watermark-02 {bottom: -20px;left: 5%;}.watermark-03 {top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 20rem;opacity: 0.5;}.geo-circle {position: absolute;border-radius: 50%;background: rgba(12, 45, 98, 0.02);z-index: -1;pointer-events: none;}.geo-square {position: absolute;border-radius: 40px;background: rgba(255, 168, 0, 0.03);transform: rotate(-15deg);z-index: -1;pointer-events: none;}@media (max-width: 1280px) {.btn-primary {padding: 12px 20px;font-size: 0.85rem;}.nav-link {font-size: 0.8rem;}.whatsapp-float {right: 20px;bottom: 20px;transform: scale(0.9);}}@media (max-width: 1024px) {.btn-primary {padding: 10px 16px;font-size: 0.8rem;}}.hex-grid {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 15px;max-width: 900px;margin: 0 auto;padding: 20px 0;}.hex-item {width: 200px;height: 230px;background: #ffffff;clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);display: flex;flex-direction: column;align-items: center;justify-content: center;text-align: center;padding: 20px;cursor: pointer;transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);position: relative;box-shadow: inset 0 0 0 2px rgba(12, 45, 98, 0.05);}.hex-content {display: flex;flex-direction: column;align-items: center;justify-content: center;z-index: 2;transition: transform 0.3s ease;}.hex-icon {font-size: 2.5rem;color: var(--primary);margin-bottom: 15px;transition: all 0.3s ease;}.hex-title {font-size: 0.95rem;font-weight: 700;color: var(--primary-dark);margin-bottom: 8px;font-family: 'Poppins', sans-serif;transition: all 0.3s ease;}.hex-desc {font-size: 0.75rem;color: var(--text-muted);line-height: 1.4;opacity: 0;height: 0;overflow: hidden;transition: all 0.3s ease;}.hex-item:hover {background: var(--accent);transform: translateY(-10px) scale(1.05);z-index: 10;}.hex-item:hover .hex-icon {color: #012052;transform: scale(1.1);}.hex-item:hover .hex-title {color: #012052;}.hex-item:hover .hex-desc {opacity: 1;height: auto;color: rgba(1, 32, 82, 0.8);margin-top: 5px;}@media (min-width: 768px) {.hex-item {margin: -25px 5px;}.hex-grid {gap: 0;}}@media (max-width: 480px) {.hex-item {width: 150px;height: 175px;}.hex-icon {font-size: 1.8rem;margin-bottom: 8px;}.hex-title {font-size: 0.8rem;}}.star-rating {color: #ffa800 !important;}.floating-group {position: relative;width: 100%;}.floating-input {width: 100%;padding: 1.5rem 1rem 0.5rem;border: 1px solid rgba(12, 45, 98, 0.15);border-radius: 12px;background: #f8fafc;font-size: 0.95rem;color: #012052;transition: all 0.3s ease;font-family: inherit;}.floating-input:focus {outline: none;border-color: var(--primary);background: #ffffff;box-shadow: 0 0 0 4px rgba(12, 45, 98, 0.05);}.floating-label {position: absolute;left: 1rem;top: 50%;transform: translateY(-50%);font-size: 0.95rem;color: rgba(12, 45, 98, 0.6);pointer-events: none;transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);}.floating-input:focus ~ .floating-label, .floating-input:not(:placeholder-shown) ~ .floating-label {top: 0.9rem;font-size: 0.7rem;color: var(--primary);font-weight: 600;}textarea.floating-input {padding-top: 1.6rem;min-height: 120px;resize: none;}.floating-group.textarea-group .floating-label {top: 1.2rem;transform: none;}textarea.floating-input:focus ~ .floating-label, textarea.floating-input:not(:placeholder-shown) ~ .floating-label {top: 0.8rem;font-size: 0.7rem;}select.floating-input {appearance: none;background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%230c2d62%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");background-repeat: no-repeat;background-position: right 1rem top 50%;background-size: 0.65rem auto;}select.floating-input ~ .floating-label {top: 0.8rem;font-size: 0.7rem;color: var(--primary);font-weight: 600;transform: none;}.contact-card {transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);}.contact-card:hover {transform: translateY(-6px);border-color: rgba(255, 168, 0, 0.4);box-shadow: 0 20px 40px rgba(12, 45, 98, 0.08);}.contact-card:hover .contact-icon {transform: scale(1.1) rotate(5deg);color: var(--primary);background-color: rgba(255, 168, 0, 0.15);}.contact-icon {transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);}.wa-card {background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);border: none;color: white;position: relative;overflow: hidden;transition: all 0.4s ease;box-shadow: 0 10px 20px rgba(37, 211, 102, 0.2);}.wa-card:hover {transform: translateY(-6px);box-shadow: 0 20px 40px rgba(37, 211, 102, 0.4);}.wa-icon-wrapper {background: rgba(255, 255, 255, 0.2);animation: pulse-wa 2s infinite;}@keyframes pulse-wa {0% {box-shadow: 0 0 0 0 rgba(255,255,255,0.5);}70% {box-shadow: 0 0 0 15px rgba(255,255,255,0);}100% {box-shadow: 0 0 0 0 rgba(255,255,255,0);}}.map-container {position: relative;overflow: hidden;border-radius: 24px;border: 1px solid rgba(12, 45, 98, 0.1);box-shadow: 0 15px 35px rgba(12, 45, 98, 0.05);transition: all 0.4s ease;background: #012052;}.map-overlay {position: absolute;inset: 0;background: rgba(1, 32, 82, 0.3);backdrop-filter: blur(2px);transition: all 0.5s ease;pointer-events: none;z-index: 10;display: flex;align-items: center;justify-content: center;}.map-overlay::after {content: 'Interaktif Map (Arahkan Kursor)';color: white;font-family: 'Poppins';font-size: 0.8rem;font-weight: 600;padding: 8px 16px;background: rgba(255,255,255,0.1);border: 1px solid rgba(255,255,255,0.2);border-radius: 20px;opacity: 1;transition: opacity 0.3s;}.map-container:hover .map-overlay {background: rgba(1, 32, 82, 0);backdrop-filter: blur(0);}.map-container:hover .map-overlay::after {opacity: 0;}.map-container iframe {transition: transform 0.8s ease;transform: scale(1.01);}.map-container:hover iframe {transform: scale(1.05);}