body{font-family:'Poppins',sans-serif;background-color:#f9fafb;color:#1a1a1a}body:not(.dark-mode){background-image:none!important;background-color:#f9fafb!important;color:#1a1a1a!important;animation:none!important}body.dark-mode{background:#111!important}
.section-heading{text-align:center;margin:3rem 0 2.2rem;font-family:'Orbitron',sans-serif;font-size:1.5rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#1a1a1a;position:relative;padding-bottom:.85rem}
.section-heading::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:60px;height:3px;border-radius:2px;background:linear-gradient(90deg,#0066ff,#00cc88);background-size:200% 100%;animation:headingAccent 3s ease infinite}
@keyframes headingAccent{0%{background-position:0% 0}50%{background-position:100% 0}100%{background-position:0% 0}}
.section-heading:first-of-type{margin-top:0}
body.dark-mode .section-heading{color:#eee}
body.dark-mode .section-heading::after{background:linear-gradient(90deg,#ff5533,#ff8833);background-size:200% 100%}
.about-hero{min-height:80vh;display:flex;align-items:center;padding:120px 5% 4rem;background:linear-gradient(135deg,rgba(0,102,255,.03) 0%,rgba(0,204,136,.03) 100%);position:relative;overflow:hidden}
.about-hero::before{content:'';position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(0,102,255,.06),transparent 70%);top:-100px;right:-100px;pointer-events:none}
.about-hero::after{content:'';position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(0,204,136,.05),transparent 70%);bottom:-80px;left:-80px;pointer-events:none}
.about-hero-orb{position:absolute;border-radius:50%;pointer-events:none;z-index:0;filter:blur(80px);opacity:.5;will-change:transform}
.about-hero-orb--1{width:350px;height:350px;top:5%;left:8%;background:radial-gradient(circle,rgba(0,102,255,.12) 0%,transparent 70%);animation:aboutOrb1 14s ease-in-out infinite alternate}
.about-hero-orb--2{width:280px;height:280px;top:55%;right:10%;background:radial-gradient(circle,rgba(0,204,136,.1) 0%,transparent 70%);animation:aboutOrb2 18s ease-in-out infinite alternate}
.about-hero-orb--3{width:200px;height:200px;bottom:15%;left:25%;background:radial-gradient(circle,rgba(100,0,200,.08) 0%,transparent 70%);animation:aboutOrb3 12s ease-in-out infinite alternate}
@keyframes aboutOrb1{0%{transform:translate(0,0) scale(1);opacity:.4}100%{transform:translate(40px,25px) scale(1.15);opacity:.65}}
@keyframes aboutOrb2{0%{transform:translate(0,0) scale(1);opacity:.35}100%{transform:translate(-35px,-20px) scale(1.1);opacity:.6}}
@keyframes aboutOrb3{0%{transform:translate(0,0) scale(1);opacity:.3}100%{transform:translate(25px,-30px) scale(1.12);opacity:.55}}
.about-badge{display:inline-block;font-family:'Orbitron',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;padding:.45rem 1.2rem;border-radius:50px;background:linear-gradient(135deg,rgba(0,102,255,.1),rgba(0,204,136,.08));border:1px solid rgba(0,102,255,.15);color:#0066ff;margin-bottom:1.2rem;opacity:0;transform:translateY(12px);animation:pageIntro 600ms cubic-bezier(.2,.9,.2,1) .05s forwards}
.about-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}
.about-text h1{font-size:3.2rem;margin-bottom:1.2rem;font-family:'Orbitron',sans-serif;font-weight:800;line-height:1.15;background:linear-gradient(135deg,#0055dd 0%,#00aa66 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.about-text p{font-size:1.05rem;line-height:1.75;color:#555;max-width:520px;margin-bottom:.5rem}
.about-image{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04)}
.about-image::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(0,102,255,.2),rgba(0,204,136,.05) 30%,rgba(0,102,255,.02) 50%,rgba(0,204,136,.1) 70%,rgba(0,102,255,.2));background-size:300% 300%;animation:imgShimmer 6s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:2;opacity:.5}
@keyframes imgShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.about-image::after{content:'';position:absolute;inset:0;border-radius:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);pointer-events:none}
.about-image img{width:100%;height:auto;border-radius:22px;display:block;transition:transform 700ms cubic-bezier(.2,.9,.2,1),filter 700ms ease}
.about-image:hover img{transform:scale(1.04);filter:brightness(1.05) saturate(1.1)}
.btn{display:inline-block;padding:.85rem 2rem;background:linear-gradient(135deg,#0055dd,#00aa66);border:none;border-radius:12px;color:#fff;font-family:'Orbitron',sans-serif;font-size:.85rem;font-weight:600;letter-spacing:1px;cursor:pointer;position:relative;overflow:hidden;transition:all .35s ease;margin-top:1.2rem;text-decoration:none;box-shadow:0 4px 16px rgba(0,85,221,.2)}
.btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transition:.6s}
.btn:hover::before{left:100%}
.btn:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 10px 30px rgba(0,85,221,.3)}
.stats-section{padding:4.5rem 5%;background:linear-gradient(180deg,#fff 0%,#f8f9fb 100%);position:relative;overflow:hidden}
.stats-section::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(50%,300px);height:1px;background:linear-gradient(90deg,transparent,rgba(0,102,255,.15) 30%,rgba(0,102,255,.15) 70%,transparent);pointer-events:none}
.stats-section::after{content:'';position:absolute;bottom:-150px;left:50%;transform:translateX(-50%);width:600px;height:300px;background:radial-gradient(ellipse,rgba(0,102,255,.04) 0%,transparent 70%);pointer-events:none}
.stats-grid{max-width:960px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;text-align:center}
.stat-card{padding:2.2rem 1rem 1.8rem;border-radius:20px;background:linear-gradient(145deg,rgba(0,102,255,.04) 0%,rgba(0,204,136,.02) 100%);border:1px solid rgba(0,102,255,.06);transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s ease,border-color .35s ease;position:relative;overflow:hidden;backdrop-filter:blur(8px)}
.stat-card::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(0,102,255,.15),rgba(0,204,136,.04) 30%,rgba(0,102,255,.02) 50%,rgba(0,204,136,.08) 70%,rgba(0,102,255,.15));background-size:300% 300%;animation:statShimmer 8s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0;opacity:.3;transition:opacity .35s ease}
@keyframes statShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.stat-card::after{content:'';position:absolute;bottom:-40px;left:50%;width:120px;height:120px;transform:translateX(-50%);background:radial-gradient(circle,rgba(0,102,255,.08) 0%,transparent 70%);pointer-events:none;opacity:0;transition:opacity .4s ease;z-index:0}
.stat-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 16px 40px rgba(0,102,255,.1),0 0 0 1px rgba(0,102,255,.06);border-color:rgba(0,102,255,.12)}
.stat-card:hover::before{opacity:.7}
.stat-card:hover::after{opacity:1}
.stat-icon{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,rgba(0,102,255,.1),rgba(0,204,136,.06));display:flex;align-items:center;justify-content:center;margin:0 auto .8rem;color:rgba(0,102,255,.6);transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s ease,background .35s ease;position:relative;z-index:1;border:1px solid rgba(0,102,255,.06)}
.stat-icon svg{width:22px;height:22px}
.stat-card:hover .stat-icon{transform:translateY(-2px) scale(1.08);box-shadow:0 6px 18px rgba(0,102,255,.12);background:linear-gradient(135deg,rgba(0,102,255,.16),rgba(0,204,136,.1));color:rgba(0,80,200,.8)}
.stat-number{display:block;font-family:'Orbitron',sans-serif;font-size:2.4rem;font-weight:800;background:linear-gradient(135deg,#0055dd,#00aa66);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.35rem;position:relative;z-index:1;filter:drop-shadow(0 2px 6px rgba(0,85,221,.12))}
.stat-label{font-size:.82rem;color:#666;font-weight:500;letter-spacing:.3px;position:relative;z-index:1}
.team-section{padding:4rem 5%;background:#f5f6f8;position:relative;overflow:hidden}
.team-bg-orb{position:absolute;border-radius:50%;pointer-events:none;z-index:0;filter:blur(70px);opacity:.4;will-change:transform}
.team-bg-orb--1{width:300px;height:300px;top:10%;left:-80px;background:radial-gradient(circle,rgba(0,102,255,.1) 0%,transparent 70%);animation:teamOrbA 16s ease-in-out infinite alternate}
.team-bg-orb--2{width:250px;height:250px;bottom:5%;right:-60px;background:radial-gradient(circle,rgba(0,204,136,.08) 0%,transparent 70%);animation:teamOrbB 14s ease-in-out infinite alternate}
@keyframes teamOrbA{0%{transform:translate(0,0) scale(1);opacity:.3}100%{transform:translate(40px,30px) scale(1.15);opacity:.5}}
@keyframes teamOrbB{0%{transform:translate(0,0) scale(1);opacity:.25}100%{transform:translate(-30px,-25px) scale(1.1);opacity:.45}}
.role-badge{display:inline-block;font-family:'Orbitron',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:.3rem .8rem;border-radius:50px;background:linear-gradient(135deg,rgba(0,102,255,.1),rgba(0,204,136,.06));border:1px solid rgba(0,102,255,.12);color:#0066ff;margin-bottom:.6rem;position:relative;z-index:1;transition:background .3s ease,border-color .3s ease,transform .3s ease}
.team-card:hover .role-badge{transform:translateY(-2px);background:linear-gradient(135deg,rgba(0,102,255,.15),rgba(0,204,136,.1));border-color:rgba(0,102,255,.2)}
.captain-badge{background:linear-gradient(135deg,rgba(0,102,255,.14),rgba(0,204,136,.1));border-color:rgba(0,102,255,.18);color:#0055dd}
.supervisor-card{border:1px solid rgba(0,102,255,.08)}
.supervisor-card .role-badge{background:linear-gradient(135deg,rgba(100,0,200,.08),rgba(0,102,255,.06));border-color:rgba(100,0,200,.12);color:#6600cc}
.supervisor-card .team-photo{background:linear-gradient(135deg,#6600cc,#0066ff);background-size:200% 200%}
.supervisor-card::before{transform:scaleX(1)!important;height:3px;background:linear-gradient(90deg,#6600cc,#0066ff);background-size:200% 100%;animation:supervisorAccent 3s ease infinite}
@keyframes supervisorAccent{0%{background-position:0% 0}50%{background-position:100% 0}100%{background-position:0% 0}}
.supervisor-card::after{opacity:.25!important}
.team-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}
.team-grid.members-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.4rem}
.members-grid .team-card{padding:1.6rem 1.2rem 1.4rem;perspective:600px}
.members-grid .team-card::before{transform:scaleX(.35)!important;opacity:.5}
.members-grid .team-card:hover::before{transform:scaleX(1)!important;opacity:1}
.members-grid .team-card::after{opacity:.18}
.members-grid .team-card:hover::after{opacity:.7}
.members-grid .team-photo{width:100px;height:100px}
.members-grid .team-card h3{font-size:.95rem;font-weight:700;letter-spacing:.3px}
.members-grid .team-card p{font-size:.78rem;letter-spacing:.5px;text-transform:uppercase;font-weight:500}
.member-card{animation:memberPop .5s cubic-bezier(.2,.9,.2,1) both;animation-delay:calc(var(--i,0) * 60ms)}
@keyframes memberPop{0%{opacity:0;transform:translateY(24px) scale(.92)}100%{opacity:1;transform:translateY(0) scale(1)}}
.member-card:hover{transform:translateY(-10px) scale(1.04) rotateX(2deg)!important;box-shadow:0 24px 52px rgba(0,102,255,.14),0 0 0 1px rgba(0,102,255,.1),0 0 60px rgba(0,102,255,.04)!important}
.member-card:hover h3{color:#0066ff}
.member-index{position:absolute;top:.6rem;right:.7rem;font-family:'Orbitron',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:1px;color:rgba(0,102,255,.2);z-index:2;transition:color .3s ease,transform .3s ease}
.member-card:hover .member-index{color:rgba(0,102,255,.55);transform:scale(1.1)}
.member-tag{display:inline-block;font-family:'Orbitron',sans-serif;font-size:.62rem;font-weight:600;letter-spacing:1.5px;padding:.2rem .65rem;border-radius:50px;background:linear-gradient(135deg,rgba(0,102,255,.06),rgba(0,204,136,.04));border:1px solid rgba(0,102,255,.1);color:#0066ff;transition:background .3s ease,border-color .3s ease,transform .3s ease}
.member-card:hover .member-tag{background:linear-gradient(135deg,rgba(0,102,255,.12),rgba(0,204,136,.08));border-color:rgba(0,102,255,.2);transform:translateY(-1px)}
.members-grid .team-card:nth-child(3n+1)::before{background:linear-gradient(90deg,#0066ff,#00cc88);background-size:200% 100%}
.members-grid .team-card:nth-child(3n+2)::before{background:linear-gradient(90deg,#00cc88,#00aaff);background-size:200% 100%}
.members-grid .team-card:nth-child(3n+3)::before{background:linear-gradient(90deg,#6644ff,#0066ff);background-size:200% 100%}
.members-grid .team-card:nth-child(3n+2) .member-index{color:rgba(0,204,136,.22)}
.members-grid .team-card:nth-child(3n+2):hover .member-index{color:rgba(0,204,136,.55)}
.members-grid .team-card:nth-child(3n+3) .member-index{color:rgba(102,68,255,.22)}
.members-grid .team-card:nth-child(3n+3):hover .member-index{color:rgba(102,68,255,.55)}
.members-grid .team-card:nth-child(3n+2):hover h3{color:#00cc88}
.members-grid .team-card:nth-child(3n+3):hover h3{color:#6644ff}
.members-grid .team-card:nth-child(3n+2) .member-tag{background:linear-gradient(135deg,rgba(0,204,136,.06),rgba(0,170,255,.04));border-color:rgba(0,204,136,.1);color:#00aa88}
.members-grid .team-card:nth-child(3n+3) .member-tag{background:linear-gradient(135deg,rgba(102,68,255,.06),rgba(0,102,255,.04));border-color:rgba(102,68,255,.1);color:#6644ff}
.members-grid .team-photo{position:relative}
.members-grid .team-photo::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:2px dashed rgba(0,102,255,.12);animation:dashSpin 20s linear infinite;pointer-events:none}
@keyframes dashSpin{to{transform:rotate(360deg)}}
.members-grid .team-card:hover .team-photo::after{border-color:rgba(0,102,255,.35);animation-duration:6s}
.members-grid .team-card:nth-child(3n+2) .team-photo::after{border-color:rgba(0,204,136,.12)}
.members-grid .team-card:nth-child(3n+2):hover .team-photo::after{border-color:rgba(0,204,136,.35)}
.members-grid .team-card:nth-child(3n+3) .team-photo::after{border-color:rgba(102,68,255,.12)}
.members-grid .team-card:nth-child(3n+3):hover .team-photo::after{border-color:rgba(102,68,255,.35)}
.team-card{background:#fff;padding:1.8rem;border-radius:18px;box-shadow:0 4px 20px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.03);text-align:center;transition:transform .3s cubic-bezier(.2,.9,.2,1),box-shadow .3s ease,border-color .3s ease;position:relative;overflow:hidden}
.team-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#0066ff,#00cc88);background-size:200% 100%;transform:scaleX(0);transform-origin:center;transition:transform .4s cubic-bezier(.2,.9,.2,1)}
.team-card::after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(0,102,255,.12),rgba(0,204,136,.04) 30%,rgba(0,102,255,.02) 50%,rgba(0,204,136,.06) 70%,rgba(0,102,255,.12));background-size:300% 300%;animation:teamShimmer 8s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s ease}
@keyframes teamShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.team-card:hover::before{transform:scaleX(1)}
.team-card:hover::after{opacity:.5}
.team-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 48px rgba(0,102,255,.1),0 0 0 1px rgba(0,102,255,.06)}
.team-card h3{font-family:'Poppins',sans-serif;font-size:1.05rem;font-weight:600;margin-bottom:.25rem;color:#1a1a1a;position:relative;z-index:1;transition:color .3s ease}
.team-card p{font-size:.85rem;color:#666;font-weight:400;position:relative;z-index:1;transition:color .3s ease}
.team-photo{width:120px;height:120px;border-radius:50%;margin:0 auto .8rem;background:linear-gradient(135deg,#0066ff,#00cc88);background-size:200% 200%;animation:photoRing 4s ease infinite;padding:3px;transition:transform .4s cubic-bezier(.2,.9,.2,1),box-shadow .4s ease;position:relative;z-index:1}
@keyframes photoRing{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.team-card:hover .team-photo{transform:scale(1.1) rotate(2deg);box-shadow:0 10px 30px rgba(0,102,255,.2)}
.team-photo img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;transition:filter .4s ease}
.team-card:hover .team-photo img{filter:brightness(1.08) saturate(1.15)}
.captain-card{border:1px solid rgba(0,102,255,.12)}
.captain-card::before{transform:scaleX(1)!important;height:3px;background:linear-gradient(90deg,#0066ff,#00cc88);background-size:200% 100%;animation:captainAccent 3s ease infinite}
@keyframes captainAccent{0%{background-position:0% 0}50%{background-position:100% 0}100%{background-position:0% 0}}
.captain-card::after{opacity:.3!important}
.captain-card h3{font-family:'Orbitron',sans-serif;font-size:1rem;letter-spacing:.5px}
.captain-card p{font-weight:600;color:#0066ff}
.timeline-section{padding:4rem 5%;background:linear-gradient(180deg,#f0f1f3,#e8eaed);position:relative}
.timeline-section::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(50%,300px);height:1px;background:linear-gradient(90deg,transparent,rgba(0,102,255,.12) 30%,rgba(0,102,255,.12) 70%,transparent);pointer-events:none}
.timeline{position:relative;max-width:1000px;margin:0 auto}
.timeline::after{content:'';position:absolute;width:3px;background:linear-gradient(to bottom,#0066ff,#00cc88);top:0;bottom:0;left:50%;margin-left:-1.5px;border-radius:2px;box-shadow:0 0 12px rgba(0,102,255,.08)}
.timeline-item{padding:16px 40px;position:relative;width:50%}
.timeline-item:nth-child(odd){left:0;text-align:right}
.timeline-item:nth-child(even){left:50%}
.timeline-year{display:inline-block;font-family:'Orbitron',sans-serif;font-size:.65rem;font-weight:700;letter-spacing:2px;padding:.25rem .7rem;border-radius:50px;background:linear-gradient(135deg,rgba(0,102,255,.1),rgba(0,204,136,.06));border:1px solid rgba(0,102,255,.12);color:#0066ff;margin-bottom:.4rem;position:relative;z-index:1}
.timeline-dot{position:absolute;top:24px;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,#0066ff,#00cc88);border:3px solid #f0f1f3;z-index:2;transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s ease;box-shadow:0 0 8px rgba(0,102,255,.15)}
.timeline-item:hover .timeline-dot{transform:scale(1.4);box-shadow:0 0 20px rgba(0,102,255,.4)}
.timeline-item:nth-child(odd) .timeline-dot{right:-10px}
.timeline-item:nth-child(even) .timeline-dot{left:-10px}
.timeline-content{background:#fff;padding:1.6rem 1.8rem;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.03);transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s ease,border-color .35s ease;position:relative;overflow:hidden;border:1px solid transparent}
.timeline-content::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(0,102,255,.12),rgba(0,204,136,.04) 30%,rgba(0,102,255,.02) 50%,rgba(0,204,136,.06) 70%,rgba(0,102,255,.12));background-size:300% 300%;animation:timelineShimmer 8s ease infinite;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s ease}
@keyframes timelineShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.timeline-content:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.07);border-color:rgba(0,102,255,.06)}
.timeline-content:hover::before{opacity:.5}
.timeline-content h3{font-family:'Orbitron',sans-serif;font-size:1rem;font-weight:700;margin:0 0 .4rem;color:#1a1a1a;letter-spacing:.5px;position:relative;z-index:1}
.timeline-content p{font-size:.9rem;color:#666;margin:0;line-height:1.6;position:relative;z-index:1}
.tl-icon{display:block;font-size:1.8rem;margin-bottom:.5rem;position:relative;z-index:1;filter:grayscale(.2);transition:transform .35s ease,filter .35s ease}
.timeline-content:hover .tl-icon{transform:scale(1.15) rotate(-5deg);filter:grayscale(0) drop-shadow(0 4px 8px rgba(0,102,255,.15))}
.about-badge,.about-text h1,.about-text p,.btn,.about-image{opacity:0;transform:translateY(20px) scale(.995);animation:pageIntro 800ms cubic-bezier(.2,.9,.2,1) forwards}
.about-badge{animation-delay:.05s}
.about-text h1{animation-delay:.15s}
.about-text p{animation-delay:.35s}
.btn{animation-delay:.55s}
.about-image{animation-delay:.65s}
@keyframes pageIntro{to{opacity:1;transform:translateY(0) scale(1)}}
.stat-card{opacity:0;transform:translateY(16px) scale(.995);animation:statReveal 600ms cubic-bezier(.2,.9,.2,1) forwards}
.stats-grid .stat-card:nth-child(1){animation-delay:.1s}
.stats-grid .stat-card:nth-child(2){animation-delay:.2s}
.stats-grid .stat-card:nth-child(3){animation-delay:.3s}
.stats-grid .stat-card:nth-child(4){animation-delay:.4s}
@keyframes statReveal{to{opacity:1;transform:translateY(0) scale(1)}}
.team-card{opacity:0;transform:translateY(14px) scale(.995);animation:cardPop 600ms cubic-bezier(.2,.9,.2,1) forwards}
.team-grid .team-card:nth-child(1){animation-delay:.1s}
.team-grid .team-card:nth-child(2){animation-delay:.18s}
.team-grid .team-card:nth-child(3){animation-delay:.26s}
.team-grid .team-card:nth-child(4){animation-delay:.34s}
.team-grid .team-card:nth-child(5){animation-delay:.42s}
.team-grid .team-card:nth-child(6){animation-delay:.50s}
.team-grid .team-card:nth-child(7){animation-delay:.56s}
.team-grid .team-card:nth-child(8){animation-delay:.62s}
.team-grid .team-card:nth-child(9){animation-delay:.68s}
.team-grid .team-card:nth-child(10){animation-delay:.74s}
.team-grid .team-card:nth-child(11){animation-delay:.80s}
.team-grid .team-card:nth-child(12){animation-delay:.86s}
.team-grid .team-card:nth-child(13){animation-delay:.92s}
.team-grid .team-card:nth-child(14){animation-delay:.98s}
.team-grid .team-card:nth-child(15){animation-delay:1.04s}
@keyframes cardPop{to{opacity:1;transform:translateY(0) scale(1)}}
.timeline-item{opacity:0;transform:translateY(12px);animation:tlReveal 600ms cubic-bezier(.2,.9,.2,1) forwards}
.timeline-item:nth-child(1){animation-delay:.15s}
.timeline-item:nth-child(2){animation-delay:.3s}
.timeline-item:nth-child(3){animation-delay:.45s}
.timeline-item:nth-child(4){animation-delay:.6s}
@keyframes tlReveal{to{opacity:1;transform:translateY(0)}}
body.dark-mode .about-hero{background:linear-gradient(135deg,rgba(255,80,40,.02),rgba(255,136,51,.02))!important}
body.dark-mode .about-hero::before{background:radial-gradient(circle,rgba(255,80,40,.04),transparent 70%)}
body.dark-mode .about-hero::after{background:radial-gradient(circle,rgba(255,136,51,.03),transparent 70%)}
body.dark-mode .about-hero-orb--1{background:radial-gradient(circle,rgba(255,90,40,.12) 0%,transparent 70%)}
body.dark-mode .about-hero-orb--2{background:radial-gradient(circle,rgba(255,160,50,.1) 0%,transparent 70%)}
body.dark-mode .about-hero-orb--3{background:radial-gradient(circle,rgba(255,100,40,.08) 0%,transparent 70%)}
body.dark-mode .about-badge{background:linear-gradient(135deg,rgba(255,100,40,.12),rgba(255,160,50,.08));border-color:rgba(255,100,40,.2);color:#ff8833}
body.dark-mode .about-text h1{background:linear-gradient(135deg,#ff4422,#ff8833);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.dark-mode .about-text p{color:#bbb}
body.dark-mode .about-image{box-shadow:0 20px 60px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.04)}
body.dark-mode .about-image::before{background:linear-gradient(135deg,rgba(255,85,51,.2),rgba(255,136,51,.05) 30%,rgba(255,85,51,.02) 50%,rgba(255,136,51,.1) 70%,rgba(255,85,51,.2));background-size:300% 300%}
body.dark-mode .btn{background:linear-gradient(135deg,#ff5533,#ff8833);color:#000;box-shadow:0 4px 16px rgba(255,80,40,.2)}
body.dark-mode .btn:hover{box-shadow:0 10px 30px rgba(255,80,40,.3)}
body.dark-mode .stats-section{background:linear-gradient(180deg,#0e0e0e 0%,#0a0a0a 100%)}
.stats-section .section-heading{margin-top:0}
body.dark-mode .stats-section::before{background:linear-gradient(90deg,transparent,rgba(255,120,50,.12) 30%,rgba(255,120,50,.12) 70%,transparent)}
body.dark-mode .stats-section::after{background:radial-gradient(ellipse,rgba(255,100,40,.04) 0%,transparent 70%)}
body.dark-mode .stat-card{background:linear-gradient(145deg,rgba(255,120,50,.04) 0%,rgba(255,160,50,.01) 100%);border-color:rgba(255,120,50,.08);transition:transform .35s cubic-bezier(.2,.9,.2,1),box-shadow .35s ease,border-color .35s ease}
body.dark-mode .stat-card::before{background:linear-gradient(135deg,rgba(255,85,51,.15),rgba(255,136,51,.04) 30%,rgba(255,85,51,.02) 50%,rgba(255,136,51,.08) 70%,rgba(255,85,51,.15));background-size:300% 300%}
body.dark-mode .stat-card::after{background:radial-gradient(circle,rgba(255,100,40,.08) 0%,transparent 70%)}
body.dark-mode .stat-card:hover{background:linear-gradient(145deg,rgba(255,120,50,.07) 0%,rgba(255,160,50,.03) 100%);box-shadow:0 16px 40px rgba(255,80,40,.12),0 0 0 1px rgba(255,136,51,.1);border-color:rgba(255,120,50,.18)}
body.dark-mode .stat-icon{background:linear-gradient(135deg,rgba(255,100,40,.1),rgba(255,160,50,.06));color:rgba(255,160,100,.6);border-color:rgba(255,120,50,.08)}
body.dark-mode .stat-card:hover .stat-icon{box-shadow:0 6px 18px rgba(255,100,40,.12);background:linear-gradient(135deg,rgba(255,100,40,.16),rgba(255,160,50,.1));color:rgba(255,180,120,.85)}
body.dark-mode .stat-number{background:linear-gradient(135deg,#ff4422,#ff8833);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px rgba(255,80,40,.15))}
body.dark-mode .stat-label{color:#999}
body.dark-mode .team-section{background:linear-gradient(180deg,#0b0b0b,#090909)!important}
body.dark-mode .team-bg-orb--1{background:radial-gradient(circle,rgba(255,90,40,.08) 0%,transparent 70%)}
body.dark-mode .team-bg-orb--2{background:radial-gradient(circle,rgba(255,160,50,.06) 0%,transparent 70%)}
body.dark-mode .role-badge{background:linear-gradient(135deg,rgba(255,100,40,.1),rgba(255,160,50,.06));border-color:rgba(255,100,40,.16);color:#ff8833}
body.dark-mode .team-card:hover .role-badge{background:linear-gradient(135deg,rgba(255,100,40,.16),rgba(255,160,50,.1));border-color:rgba(255,100,40,.25)}
body.dark-mode .captain-badge{background:linear-gradient(135deg,rgba(255,100,40,.14),rgba(255,160,50,.08));border-color:rgba(255,100,40,.2);color:#ff7722}
body.dark-mode .supervisor-card{border-color:rgba(255,80,40,.12)}
body.dark-mode .supervisor-card .role-badge{background:linear-gradient(135deg,rgba(255,120,80,.1),rgba(255,80,40,.06));border-color:rgba(255,120,80,.16);color:#ff9966}
body.dark-mode .supervisor-card .team-photo{background:linear-gradient(135deg,#ff6633,#ff4422);background-size:200% 200%}
body.dark-mode .supervisor-card::before{background:linear-gradient(90deg,#ff6633,#ff4422);background-size:200% 100%}
body.dark-mode .team-card{background:linear-gradient(145deg,rgba(255,255,255,.03) 0%,rgba(255,255,255,.01) 100%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 20px rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.04);transition:transform .3s cubic-bezier(.2,.9,.2,1),box-shadow .3s ease,background .3s ease}
body.dark-mode .team-card::before{background:linear-gradient(90deg,#ff5533,#ff8833);background-size:200% 100%}
body.dark-mode .team-card::after{background:linear-gradient(135deg,rgba(255,85,51,.15),rgba(255,136,51,.04) 30%,rgba(255,85,51,.02) 50%,rgba(255,136,51,.06) 70%,rgba(255,85,51,.15));background-size:300% 300%}
body.dark-mode .members-grid .team-card::after{opacity:.15}
body.dark-mode .members-grid .team-card:hover::after{opacity:.55}
body.dark-mode .member-index{color:rgba(255,136,51,.18)}
body.dark-mode .member-card:hover .member-index{color:rgba(255,136,51,.55)}
body.dark-mode .member-card:hover h3{color:#ff8833!important}
body.dark-mode .member-tag{background:linear-gradient(135deg,rgba(255,100,40,.08),rgba(255,160,50,.04));border-color:rgba(255,100,40,.14);color:#ff8833}
body.dark-mode .member-card:hover .member-tag{background:linear-gradient(135deg,rgba(255,100,40,.16),rgba(255,160,50,.08));border-color:rgba(255,100,40,.3)}
body.dark-mode .members-grid .team-card:nth-child(3n+1)::before{background:linear-gradient(90deg,#ff5533,#ff8833);background-size:200% 100%}
body.dark-mode .members-grid .team-card:nth-child(3n+2)::before{background:linear-gradient(90deg,#ff8833,#ffaa44);background-size:200% 100%}
body.dark-mode .members-grid .team-card:nth-child(3n+3)::before{background:linear-gradient(90deg,#ff4422,#ff6633);background-size:200% 100%}
body.dark-mode .members-grid .team-card:nth-child(3n+2) .member-index{color:rgba(255,170,68,.18)}
body.dark-mode .members-grid .team-card:nth-child(3n+2):hover .member-index{color:rgba(255,170,68,.55)}
body.dark-mode .members-grid .team-card:nth-child(3n+3) .member-index{color:rgba(255,68,34,.18)}
body.dark-mode .members-grid .team-card:nth-child(3n+3):hover .member-index{color:rgba(255,68,34,.55)}
body.dark-mode .members-grid .team-card:nth-child(3n+2):hover h3{color:#ffaa44!important}
body.dark-mode .members-grid .team-card:nth-child(3n+3):hover h3{color:#ff6633!important}
body.dark-mode .members-grid .team-card:nth-child(3n+2) .member-tag{background:linear-gradient(135deg,rgba(255,170,68,.08),rgba(255,200,80,.04));border-color:rgba(255,170,68,.14);color:#ffaa44}
body.dark-mode .members-grid .team-card:nth-child(3n+3) .member-tag{background:linear-gradient(135deg,rgba(255,68,34,.08),rgba(255,100,50,.04));border-color:rgba(255,68,34,.14);color:#ff6633}
body.dark-mode .member-card:hover{box-shadow:0 24px 52px rgba(255,80,40,.14),0 0 0 1px rgba(255,136,51,.14),0 0 60px rgba(255,100,40,.04)!important}
body.dark-mode .members-grid .team-photo::after{border-color:rgba(255,136,51,.1)}
body.dark-mode .members-grid .team-card:hover .team-photo::after{border-color:rgba(255,136,51,.35)}
body.dark-mode .members-grid .team-card:nth-child(3n+2) .team-photo::after{border-color:rgba(255,170,68,.1)}
body.dark-mode .members-grid .team-card:nth-child(3n+2):hover .team-photo::after{border-color:rgba(255,170,68,.35)}
body.dark-mode .members-grid .team-card:nth-child(3n+3) .team-photo::after{border-color:rgba(255,68,34,.1)}
body.dark-mode .members-grid .team-card:nth-child(3n+3):hover .team-photo::after{border-color:rgba(255,68,34,.35)}
body.dark-mode .team-card:hover{background:linear-gradient(145deg,rgba(255,120,50,.06) 0%,rgba(255,160,50,.02) 100%);box-shadow:0 20px 48px rgba(255,80,40,.14),0 0 0 1px rgba(255,136,51,.14),0 0 40px rgba(255,100,40,.06)}
body.dark-mode .team-card h3{color:#f5ede6}
body.dark-mode .team-card p{color:#a09080}
body.dark-mode .team-photo{background:linear-gradient(135deg,#ff4422,#ff8833);background-size:200% 200%}
body.dark-mode .team-card:hover .team-photo{box-shadow:0 10px 30px rgba(255,100,40,.2)}
body.dark-mode .captain-card{border-color:rgba(255,80,40,.18)}
body.dark-mode .captain-card p{color:#ff8833}
body.dark-mode .captain-card::before{background:linear-gradient(90deg,#ff4422,#ffaa44);background-size:200% 100%;box-shadow:0 1px 8px rgba(255,80,40,.2)}
body.dark-mode .captain-card::after{opacity:.3!important}
body.dark-mode .timeline-section{background:linear-gradient(180deg,#090909,#0c0c0c)!important}
body.dark-mode .timeline-section::before{background:linear-gradient(90deg,transparent,rgba(255,120,50,.1) 30%,rgba(255,120,50,.1) 70%,transparent)}
body.dark-mode .timeline::after{background:linear-gradient(to bottom,#ff5533,#ff8833);box-shadow:0 0 12px rgba(255,100,40,.1)}
body.dark-mode .timeline-year{background:linear-gradient(135deg,rgba(255,100,40,.12),rgba(255,160,50,.06));border-color:rgba(255,100,40,.18);color:#ff8833}
body.dark-mode .timeline-dot{background:linear-gradient(135deg,#ff5533,#ff8833);border-color:#0c0c0c;box-shadow:0 0 10px rgba(255,80,40,.25)}
body.dark-mode .timeline-item:hover .timeline-dot{box-shadow:0 0 22px rgba(255,80,40,.5)}
body.dark-mode .timeline-content{background:rgba(255,255,255,.025);box-shadow:0 4px 20px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04);border-color:transparent}
body.dark-mode .timeline-content::before{background:linear-gradient(135deg,rgba(255,85,51,.12),rgba(255,136,51,.03) 30%,rgba(255,85,51,.02) 50%,rgba(255,136,51,.06) 70%,rgba(255,85,51,.12));background-size:300% 300%}
body.dark-mode .timeline-content:hover{background:rgba(255,120,50,.03);box-shadow:0 16px 40px rgba(0,0,0,.4),0 0 0 1px rgba(255,136,51,.08);border-color:rgba(255,120,50,.08)}
body.dark-mode .timeline-content h3{color:#f0f0f0}
body.dark-mode .timeline-content p{color:#bbb}
body.dark-mode .tl-icon{filter:grayscale(.1)}
body.dark-mode .timeline-content:hover .tl-icon{filter:grayscale(0) drop-shadow(0 4px 8px rgba(255,100,40,.2))}
@media(max-width:768px){
.about-hero{min-height:auto;padding:100px 5% 3rem}
.about-hero::before,.about-hero::after,.about-hero-orb,.team-bg-orb{display:none}
.about-content{grid-template-columns:1fr;text-align:center;gap:2rem}
.about-badge{margin-left:auto;margin-right:auto}
.about-text h1{font-size:2rem;margin-bottom:1rem}
.about-text p{font-size:.95rem;margin:0 auto .5rem}
.about-image{border-radius:16px}
.about-image img{border-radius:16px}
.stats-section{padding:3rem 5%}
.stats-grid{grid-template-columns:repeat(2,1fr);gap:1rem}
.stat-card{padding:1.4rem .8rem 1.2rem}
.stat-number{font-size:1.7rem}
.stat-icon{width:36px;height:36px;border-radius:10px}
.stat-icon svg{width:18px;height:18px}
.team-section{padding:3rem 5%}
.team-grid{grid-template-columns:1fr;gap:1.2rem}
.team-grid.members-grid{grid-template-columns:repeat(3,1fr);gap:1rem}
.team-card{padding:1.4rem}
.team-photo{width:100px;height:100px}
.members-grid .team-photo{width:76px;height:76px}
.members-grid .team-card{padding:1.1rem .9rem}
.member-index{font-size:.55rem;top:.5rem;right:.5rem}
.member-tag{font-size:.56rem;padding:.15rem .5rem}
.timeline-section{padding:3rem 5%}
.timeline::after{left:20px}
.timeline-item{width:100%;padding-left:50px;padding-right:15px}
.timeline-item:nth-child(odd),.timeline-item:nth-child(even){left:0;text-align:left}
.timeline-item:nth-child(odd) .timeline-dot,.timeline-item:nth-child(even) .timeline-dot{left:12px}
.timeline-content{padding:1.2rem}
.section-heading{font-size:1.2rem;letter-spacing:1.5px}
.timeline-year{font-size:.6rem;padding:.2rem .5rem}
}
@media(max-width:480px){
.about-hero{padding:90px 4% 2rem}
.about-text h1{font-size:1.65rem}
.about-badge{font-size:.6rem;padding:.35rem .9rem}
.stats-grid{gap:.75rem}
.stat-number{font-size:1.5rem}
.stat-label{font-size:.75rem}
.team-grid.members-grid{grid-template-columns:repeat(2,1fr);gap:.8rem}
.members-grid .team-card{padding:.9rem .7rem}
.members-grid .team-photo{width:64px;height:64px}
.member-index{font-size:.5rem}
.member-tag{font-size:.52rem;padding:.12rem .4rem;letter-spacing:1px}
}
@media(prefers-reduced-motion:reduce){
.about-text h1,.about-text p,.btn,.about-image,.about-badge,.team-card,.timeline-content,.stat-card,.timeline-item,.about-hero-orb,.team-bg-orb,.stat-card::before,.team-card::after,.timeline-content::before,.about-image::before,.section-heading::after,.captain-card::before,.supervisor-card::before,.role-badge,.tl-icon,.team-photo,.member-card,.members-grid .team-photo::after,.member-index,.member-tag{animation:none!important;transition:none!important}
}