:root{--primary-dark: #0A1628;--primary-navy: #1B2A4A;--primary-blue: #1A5276;--primary-water: #2471A3;--primary-light: #5DADE2;--primary-sky: #85C1E9;--accent-gold: #D4AC0D;--accent-gold-light: #F4D03F;--accent-orange: #E67E22;--white: #FFFFFF;--off-white: #F8F9FA;--light-gray: #ECF0F1;--medium-gray: #BDC3C7;--dark-gray: #2C3E50;--text-primary: #1A2A3A;--text-secondary: #4A5A6A;--pipe-metal: #7F8C8D;--pipe-copper: #CD7F32;--water-drop: #3498DB;--leak-blue: #2E86C1;--shadow-sm: 0 2px 8px rgba(0,0,0,.06);--shadow-md: 0 4px 20px rgba(0,0,0,.08);--shadow-lg: 0 8px 40px rgba(0,0,0,.12);--shadow-xl: 0 12px 60px rgba(0,0,0,.16);--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--transition-fast: .2s ease;--transition-medium: .4s cubic-bezier(.4, 0, .2, 1);--transition-slow: .6s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif;color:var(--text-primary);background:#0A1628;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}input::-ms-reveal,input::-ms-clear,input[type=password]::-webkit-reveal,input[type=password]::-webkit-clear-button{display:none!important;width:0!important;height:0!important}html,body,#root{width:100%;max-width:100%;overflow-x:hidden}.container{max-width:1240px;width:min(100% - 32px,1240px);margin-inline:auto;padding:0;box-sizing:border-box}img{max-width:100%;height:auto}.page-hero{position:relative;padding:50px 0;background:linear-gradient(135deg,#0A1628 0%,#1A2A4A 40%,#1A5276 100%);color:var(--white);text-align:center;overflow:hidden}.page-hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:24px 24px;pointer-events:none}.page-hero-title{font-size:clamp(2rem,5.5vw,3.2rem);font-weight:800;color:var(--white);margin-bottom:16px;letter-spacing:-.02em;line-height:1.15;word-break:normal;overflow-wrap:break-word}.page-hero-subtitle{font-size:clamp(.95rem,2.5vw,1.2rem);color:#ffffffd9;max-width:680px;margin:0 auto;line-height:1.7}.section{padding:80px 0;position:relative}.section-alt{background:#F4F7F9}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.25;color:var(--text-primary);word-break:normal;overflow-wrap:break-word}h1{font-size:clamp(2.2rem,6vw,3.5rem)}h2{font-size:clamp(1.8rem,5vw,2.5rem)}h3{font-size:clamp(1.35rem,4vw,1.75rem)}h4{font-size:clamp(1.1rem,3vw,1.25rem)}.employee-dashboard{--employee-page-bg: #0A1628;--employee-card-bg: #16243B;--employee-heading: #F8FAFC;--employee-body: #DCE7F5;--employee-accent: #7DD3FC;--employee-button-bg: #38BDF8;--employee-button-text: #082F49;min-height:100vh;padding:96px 24px 48px;background:var(--employee-page-bg);color:var(--employee-heading)}.employee-dashboard__card{max-width:880px;margin:0 auto;padding:32px;border:1px solid #29425F;border-radius:18px;background:var(--employee-card-bg);box-shadow:0 16px 36px #0000002e}.employee-dashboard__eyebrow{margin:0 0 8px;color:var(--employee-accent)!important;font-weight:700;letter-spacing:.08em}.employee-dashboard__title{margin:0 0 12px;color:var(--employee-heading)!important;font-size:clamp(2rem,5vw,2.75rem)}.employee-dashboard__description{margin:0;color:var(--employee-body)!important;line-height:1.6}.employee-dashboard__logout{margin-top:28px;padding:12px 20px;border:0;border-radius:10px;background:var(--employee-button-bg);color:var(--employee-button-text);cursor:pointer;font-weight:800}.employee-dashboard__logout:hover,.employee-dashboard__logout:focus-visible{background:#BAE6FD;outline:3px solid #FFFFFF;outline-offset:3px}.employee-dashboard.light-theme,.employee-dashboard[data-theme=light],.employee-portal.light-theme .employee-dashboard,.employee-portal[data-theme=light] .employee-dashboard{--employee-page-bg: #F1F5F9;--employee-card-bg: #FFFFFF;--employee-heading: #0A1628;--employee-body: #334155;--employee-accent: #0369A1;--employee-button-bg: #0369A1;--employee-button-text: #FFFFFF}.employee-dashboard.light-theme .employee-dashboard__card,.employee-dashboard[data-theme=light] .employee-dashboard__card,.employee-portal.light-theme .employee-dashboard__card,.employee-portal[data-theme=light] .employee-dashboard__card{border-color:#cbd5e1}@media (max-width: 600px){.employee-dashboard{padding:80px 16px 32px}.employee-dashboard__card{padding:24px 20px;border-radius:14px}.employee-dashboard__logout{width:100%;min-height:44px}}.section-title{font-size:clamp(1.75rem,5vw,2.5rem);font-weight:800;margin-bottom:.75rem;position:relative;display:inline-block;color:var(--primary-dark);line-height:1.2;letter-spacing:-.02em;word-break:normal;overflow-wrap:break-word}.section-title:after{content:"";position:absolute;bottom:-8px;left:0;width:60px;height:4px;background:linear-gradient(90deg,var(--primary-water),var(--primary-light));border-radius:4px}.section-title-center{text-align:center;display:block}.section-title-center:after{left:50%;transform:translate(-50%)}.section-subtitle{color:var(--text-secondary);font-size:clamp(.95rem,2.5vw,1.1rem);max-width:640px;margin:16px auto 0;text-align:center;line-height:1.7}.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 32px;border-radius:50px;font-weight:600;font-size:1rem;text-decoration:none;transition:var(--transition-medium);border:none;cursor:pointer;position:relative;overflow:hidden}.btn-primary{background:linear-gradient(135deg,var(--primary-water),var(--primary-blue));color:var(--white);box-shadow:0 4px 20px #2471a34d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #2471a366}.btn-secondary{background:var(--accent-gold);color:var(--white);box-shadow:0 4px 20px #d4ac0d4d}.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #d4ac0d66;background:#C9A80A}.btn-outline{background:transparent;border:2px solid var(--white);color:var(--white)}.btn-outline:hover{background:var(--white);color:var(--primary-navy);transform:translateY(-2px)}.btn-cta{background:var(--accent-orange);color:var(--white);box-shadow:0 4px 20px #e67e224d;animation:pulse-cta 2s infinite}.btn-cta:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 30px #e67e2266}@keyframes pulse-cta{0%,to{box-shadow:0 4px 20px #e67e224d}50%{box-shadow:0 4px 40px #e67e2280}}.card-premium{background:var(--white);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--shadow-md);transition:var(--transition-medium);position:relative;overflow:hidden}.card-premium:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-water),var(--primary-light));opacity:0;transition:var(--transition-medium)}.card-premium:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}.card-premium:hover:before{opacity:1}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--off-white);border-radius:10px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary-water),var(--primary-blue));border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-60px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(60px)}to{opacity:1;transform:translate(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes water-drop{0%{transform:translateY(-20px);opacity:0}50%{opacity:1}to{transform:translateY(20px);opacity:0}}@keyframes pipe-flow{0%{background-position:0% 50%}to{background-position:200% 50%}}@keyframes pulse-slow{0%,to{opacity:1}50%{opacity:.6}}.animate-fadeInUp{animation:fadeInUp .8s ease forwards}.animate-slideInLeft{animation:slideInLeft .8s ease forwards}.animate-slideInRight{animation:slideInRight .8s ease forwards}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}.delay-4{animation-delay:.4s}.delay-5{animation-delay:.5s}@media (max-width: 1024px){h1{font-size:2.8rem}h2{font-size:2.2rem}h3{font-size:1.5rem}}@media (max-width: 768px){h1{font-size:2.2rem}h2{font-size:1.8rem}h3{font-size:1.3rem}.container{padding:0 16px}.btn{padding:12px 24px;font-size:.9rem}}@media (max-width: 480px){h1{font-size:1.8rem}h2{font-size:1.5rem}h3{font-size:1.1rem}.container{padding:0 12px}.section{padding:50px 0}.page-hero{padding:40px 0 35px}.page-hero-title{font-size:2.2rem}}.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px}@media (max-width: 768px){.services-grid{grid-template-columns:1fr;gap:20px}}.service-card-item{background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;border:1px solid rgba(0,0,0,.05)}.service-card-item:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl)}.service-card-image{height:210px;width:100%;position:relative;overflow:hidden;background:var(--primary-navy)}.service-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.service-card-item:hover .service-card-image img{transform:scale(1.08)}.service-card-badge{position:absolute;top:16px;right:16px;background:rgba(10,22,40,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--accent-gold);padding:6px 14px;border-radius:50px;font-size:.75rem;font-weight:700;letter-spacing:.5px;border:1px solid rgba(255,255,255,.1)}.service-card-body{padding:24px;display:flex;flex-direction:column;flex-grow:1}.service-icon-wrapper{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--primary-water),var(--primary-blue));color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-top:-50px;margin-bottom:16px;position:relative;z-index:2;box-shadow:0 6px 20px #2471a359;border:3px solid var(--white)}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(10,22,40,.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .3s ease}.modal-content{background:var(--white);border-radius:24px;max-width:750px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 25px 50px -12px #0006;position:relative;animation:slideUp .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes waterDropFalling{0%{transform:translateY(0) scale(.9);opacity:0}15%{opacity:.8}85%{opacity:.6}to{transform:translateY(500px) scale(1.1);opacity:0}}@keyframes pipeStreamFlow{0%{stroke-dashoffset:0}to{stroke-dashoffset:-72}}@media (prefers-reduced-motion: reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.admin-portal.light-theme,.admin-portal[data-theme=light],.employee-portal.light-theme,.employee-portal[data-theme=light]{--admin-bg: #F1F5F9;--admin-card-bg: #FFFFFF;--admin-text-primary: #0A1628;--admin-text-secondary: #475569;--admin-border: #CBD5E1;--admin-input-bg: #FFFFFF;--admin-input-text: #0A1628;--employee-bg: #F8FAFC;--employee-header-bg: #FFFFFF;--employee-text-primary: #0A1628;--employee-text-secondary: #475569;--employee-border: #E2E8F0;background-color:#f1f5f9!important;color:#0a1628!important}.admin-portal.dark-theme,.admin-portal[data-theme=dark],.employee-portal.dark-theme,.employee-portal[data-theme=dark]{--admin-bg: #0A1628;--admin-card-bg: #1E293B;--admin-text-primary: #F8FAFC;--admin-text-secondary: #94A3B8;--admin-border: #334155;--admin-input-bg: #0F172A;--admin-input-text: #FFFFFF;--employee-bg: #0A1628;--employee-header-bg: #0A1628;--employee-text-primary: #F8FAFC;--employee-text-secondary: #94A3B8;--employee-border: #334155;background-color:#0a1628!important;color:#f8fafc!important}.admin-portal.light-theme h1,.admin-portal.light-theme h2,.admin-portal.light-theme h3,.admin-portal.light-theme h4,.admin-portal.light-theme th,.admin-portal.light-theme td,.employee-portal.light-theme h1,.employee-portal.light-theme h2,.employee-portal.light-theme h3,.employee-portal.light-theme h4,.employee-portal.light-theme th,.employee-portal.light-theme td{color:#0a1628!important}.admin-portal.dark-theme h1,.admin-portal.dark-theme h2,.admin-portal.dark-theme h3,.admin-portal.dark-theme h4,.admin-portal.dark-theme th,.admin-portal.dark-theme td,.employee-portal.dark-theme h1,.employee-portal.dark-theme h2,.employee-portal.dark-theme h3,.employee-portal.dark-theme h4,.employee-portal.dark-theme th,.employee-portal.dark-theme td{color:#f8fafc!important}.admin-portal.light-theme .admin-welcome-title,.admin-portal.light-theme .admin-welcome-subtitle{color:#fff!important}.admin-portal.dark-theme input:not([type=submit]):not([type=button]),.admin-portal.dark-theme textarea,.admin-portal.dark-theme select,.employee-portal.dark-theme input:not([type=submit]):not([type=button]),.employee-portal.dark-theme textarea,.employee-portal.dark-theme select{background-color:#0f172a!important;color:#fff!important;border-color:#334155!important}.admin-portal.dark-theme select option,.employee-portal.dark-theme select option{background-color:#0f172a!important;color:#fff!important}.admin-portal.dark-theme label,.admin-portal.dark-theme p,.admin-portal.dark-theme span:not(.badge):not(.btn),.employee-portal.dark-theme label,.employee-portal.dark-theme p,.employee-portal.dark-theme span:not(.badge):not(.btn){color:#e2e8f0}.admin-portal.dark-theme .card,.admin-portal.dark-theme table,.admin-portal.dark-theme .modal-content,.admin-portal.dark-theme form div[style*="background: #FFF"],.admin-portal.dark-theme form div[style*="background: #fff"],.employee-portal.dark-theme .card,.employee-portal.dark-theme table,.employee-portal.dark-theme .modal-content,.employee-portal.dark-theme form div[style*="background: #FFF"],.employee-portal.dark-theme form div[style*="background: #fff"]{background-color:#1e293b!important;color:#f8fafc!important;border-color:#334155!important}.admin-portal.dark-theme th,.employee-portal.dark-theme th{background-color:#0f172a!important;color:#f8fafc!important;border-color:#334155!important}.admin-portal.dark-theme td,.employee-portal.dark-theme td{border-color:#334155!important;color:#e2e8f0!important}.admin-portal.light-theme input:not([type=submit]):not([type=button]),.admin-portal.light-theme textarea,.admin-portal.light-theme select,.employee-portal.light-theme input:not([type=submit]):not([type=button]),.employee-portal.light-theme textarea,.employee-portal.light-theme select{background-color:#fff!important;color:#0a1628!important;border-color:#cbd5e1!important}.admin-portal.light-theme label,.admin-portal.light-theme p,.admin-portal.light-theme span:not(.badge):not(.btn),.employee-portal.light-theme label,.employee-portal.light-theme p,.employee-portal.light-theme span:not(.badge):not(.btn){color:#334155}.admin-portal.light-theme .card,.admin-portal.light-theme table,.admin-portal.light-theme form div[style*="background: #FFF"],.admin-portal.light-theme form div[style*="background: #fff"],.employee-portal.light-theme .card,.employee-portal.light-theme table,.employee-portal.light-theme form div[style*="background: #FFF"],.employee-portal.light-theme form div[style*="background: #fff"]{background-color:#fff!important;color:#0a1628!important;border-color:#e2e8f0!important}.admin-portal.light-theme th,.employee-portal.light-theme th{background-color:#f8fafc!important;color:#0a1628!important;border-color:#e2e8f0!important}.admin-portal.light-theme td,.employee-portal.light-theme td{border-color:#e2e8f0!important;color:#1e293b!important}img,svg,video,iframe{max-width:100%;height:auto;object-fit:cover}*,:before,:after{box-sizing:border-box}.table-responsive,.table-wrapper{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:1rem}.table-responsive table,.table-wrapper table{width:100%;min-width:600px;border-collapse:collapse}.modal-backdrop,.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;padding:16px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;z-index:10000;overflow-y:auto}.modal-content,.modal-dialog{max-width:min(92vw,760px);width:100%;max-height:calc(100vh - 32px);display:flex;flex-direction:column;overflow:hidden;border-radius:20px;box-shadow:0 25px 50px -12px #0006}.modal-header,.modal-footer{flex-shrink:0}.modal-body{flex:1 1 auto;overflow-y:auto;padding:20px;word-break:break-word;overflow-wrap:anywhere}@media (max-width: 430px){.container{padding-left:12px!important;padding-right:12px!important}.modal-content,.modal-dialog{max-width:96vw!important;border-radius:16px!important}.btn{width:100%;justify-content:center}}@media (max-width: 768px){.hero-grid,.services-grid,.stats-grid{grid-template-columns:1fr!important}}@media (min-width: 1920px){.container{max-width:1600px}}