*{margin:0;padding:0;box-sizing:border-box}:root{--bg:#000000;--text:#ffffff;--accent:#6366f1;--accent-2:#8b5cf6;--accent-3:#06b6d4;--gray:#71717a}html{scroll-behavior:smooth}/* Custom Scrollbar */::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg, var(--accent), var(--accent-2));border-radius:10px;border:2px solid var(--bg)}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg, var(--accent-2), var(--accent-3))}/* Firefox */ *{scrollbar-width:thin;scrollbar-color:var(--accent) var(--bg)}body{font-family:'Space Grotesk', sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;cursor:none}body.loading{overflow:hidden}/* Preloader */ .preloader{position:fixed;inset:0;background:var(--bg);z-index:10000;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:40px}.preloader::before{content:'';position:absolute;width:400px;height:400px;background:var(--accent);filter:blur(150px);opacity:0.3;animation:preloaderGlow 2s ease-in-out infinite alternate}@keyframes preloaderGlow{from{transform:scale(1);opacity:0.2}to{transform:scale(1.2);opacity:0.4}}.preloader.hidden{opacity:0;pointer-events:none;transition:opacity 0.6s ease}.loader-logo{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.loader-dot{width:12px;height:12px;background:var(--accent);border-radius:50%;animation:loaderDotPulse 1s ease-in-out infinite;box-shadow:0 0 20px var(--accent), 0 0 40px var(--accent)}@keyframes loaderDotPulse{0%, 100%{transform:scale(1)}50%{transform:scale(1.3)}}.loader-text{font-size:clamp(28px, 6vw, 56px);font-weight:700;letter-spacing:-0.03em;background:linear-gradient(135deg, var(--text) 0%, var(--gray) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.loader-progress-wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:16px}.loader-bar{width:200px;height:2px;background:rgba(255,255,255,0.1);border-radius:2px;overflow:hidden}.loader-progress{height:100%;background:linear-gradient(90deg, var(--accent), var(--accent-3));width:0%;box-shadow:0 0 10px var(--accent);transition:width 0.1s}.loader-percent{font-size:0.75rem;color:var(--gray);letter-spacing:0.1em;font-variant-numeric:tabular-nums}/* Custom Cursor */ .cursor{width:16px;height:16px;background:var(--accent);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;mix-blend-mode:difference;transition:transform 0.15s ease, width 0.3s, height 0.3s;transform:translate(-50%, -50%)}.cursor.hover{width:80px;height:80px;mix-blend-mode:normal;background:rgba(99, 102, 241, 0.2);backdrop-filter:blur(4px)}.cursor-text{position:fixed;pointer-events:none;z-index:9999;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.1em;opacity:0;transform:translate(-50%, -50%);transition:opacity 0.3s}.cursor.hover + .cursor-text{opacity:1}/* Gradient Mesh Background */ .gradient-bg{position:fixed;inset:0;z-index:0;overflow:hidden}.gradient-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:0.5;animation:orbFloat 20s ease-in-out infinite}.orb-1{width:600px;height:600px;background:var(--accent);top:-200px;right:-200px;animation-delay:0s}.orb-2{width:500px;height:500px;background:var(--accent-2);bottom:-150px;left:-150px;animation-delay:-7s}.orb-3{width:400px;height:400px;background:var(--accent-3);top:50%;left:50%;animation-delay:-14s}@keyframes orbFloat{0%, 100%{transform:translate(0, 0) scale(1)}25%{transform:translate(50px, -50px) scale(1.1)}50%{transform:translate(-30px, 30px) scale(0.9)}75%{transform:translate(30px, 50px) scale(1.05)}}/* Grid overlay */ .grid-overlay{position:fixed;inset:0;z-index:1;background-image:linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);background-size:80px 80px;pointer-events:none}/* Content */ .content{position:relative;z-index:2}/* Scroll Reveal */ .reveal{opacity:0;transform:translateY(40px);transition:all 0.8s cubic-bezier(0.16, 1, 0.3, 1)}.reveal.revealed{opacity:1;transform:translateY(0)}/* Navigation */ nav{position:fixed;top:0;left:0;right:0;padding:24px 48px;display:flex;justify-content:space-between;align-items:center;z-index:1002}.logo{font-size:1.25rem;font-weight:700;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:8px}.logo-dot{width:8px;height:8px;background:var(--accent);border-radius:50%;animation:logoPulse 2s ease-in-out infinite}@keyframes logoPulse{0%, 100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:0.5}}/* Logo Activity Animation */ .logo-activity{display:none;margin-left:8px;font-size:0.65rem;font-weight:400;color:var(--gray);text-transform:uppercase;letter-spacing:0.1em;position:relative;height:16px;overflow:hidden}.logo-activity-inner{display:flex;flex-direction:column;animation:activitySlide 8s ease-in-out infinite}.logo-activity span{height:16px;line-height:16px;display:flex;align-items:center;gap:6px}.logo-activity span::before{content:'―';color:var(--accent)}@keyframes activitySlide{0%, 20%{transform:translateY(0)}25%, 45%{transform:translateY(-16px)}50%, 70%{transform:translateY(-32px)}75%, 95%{transform:translateY(-48px)}100%{transform:translateY(0)}}.nav-links{display:flex;gap:48px}.nav-links a{color:var(--text);text-decoration:none;font-size:0.85rem;text-transform:uppercase;letter-spacing:0.15em;position:relative;padding:8px 0}.nav-links a span{display:inline-block;transition:transform 0.3s}.nav-links a:hover span{transform:translateY(-100%)}.nav-links a::after{content:attr(data-text);position:absolute;left:0;top:100%;color:var(--accent);transform:translateY(-100%);transition:transform 0.3s}.nav-links a:hover::after{transform:translateY(-200%)}/* Hero */ .hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 48px;position:relative}.hero-content{position:relative}.hero-eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:0.8rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--gray);margin-bottom:32px}.hero-eyebrow::before{content:'';width:40px;height:1px;background:var(--accent)}.hero-title{font-size:clamp(48px, 12vw, 180px);font-weight:700;line-height:0.95;letter-spacing:-0.04em;margin-bottom:40px}.hero-title .line{display:block;overflow:hidden;position:relative}.hero-title .word{display:inline-block;transform:translateY(120%);opacity:0;transition:all 0.3s ease}.hero-title .word.revealed{animation:wordReveal 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards}.hero-title .line:first-child .word.revealed{animation:none;opacity:1;transform:translateY(0)}@keyframes wordReveal{to{transform:translateY(0);opacity:1}}.hero-title .gradient{background:linear-gradient(135deg, var(--accent) 0%, var(--accent-3) 50%, var(--accent-2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 200%;animation:gradientMove 5s ease infinite}@keyframes gradientMove{0%, 100%{background-position:0% 50%}50%{background-position:100% 50%}}.hero-title .outline{color:transparent;-webkit-text-stroke:1.5px var(--text)}.hero-desc{max-width:500px;font-size:1.1rem;color:var(--gray);line-height:1.7;margin-bottom:48px}.hero-cta{display:flex;gap:24px;align-items:center}.magnetic-btn{position:relative;padding:20px 48px;background:rgba(255,255,255,0.03);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.15);border-radius:100px;color:var(--text);font-family:inherit;font-size:0.9rem;font-weight:500;text-decoration:none;cursor:none;overflow:hidden;transition:all 0.3s;box-shadow:0 4px 20px rgba(0,0,0,0.1)}.magnetic-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, var(--accent), var(--accent-2));transform:scaleX(0);transform-origin:right;transition:transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);z-index:0}.magnetic-btn:hover::before{transform:scaleX(1);transform-origin:left}.magnetic-btn span{position:relative;z-index:1;display:flex;align-items:center;gap:12px}.magnetic-btn:hover{border-color:transparent}.btn-arrow{width:20px;height:20px;transition:transform 0.3s}.magnetic-btn:hover .btn-arrow{transform:translate(4px, -4px)}.play-btn{display:flex;align-items:center;gap:16px;color:var(--text);text-decoration:none;font-size:0.9rem}.play-circle{width:60px;height:60px;background:rgba(255,255,255,0.05);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.15);border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;transition:all 0.3s;box-shadow:0 4px 20px rgba(0,0,0,0.1)}.play-circle::before{content:'';position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--accent);opacity:0;transform:scale(1.2);transition:all 0.3s}.play-btn:hover .play-circle::before{opacity:1;transform:scale(1)}.play-btn:hover .play-circle{border-color:transparent;background:rgba(99, 102, 241, 0.1)}/* Stats */ .stats{display:flex;position:absolute;bottom:48px;right:48px;gap:64px}.stat{text-align:right;padding:20px 24px;background:rgba(255,255,255,0.03);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.08);border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,0.1)}.stat-number{font-size:3rem;font-weight:700;background:linear-gradient(135deg, var(--accent) 0%, var(--accent-3) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.15em;color:var(--gray)}/* Marquee */ .marquee-section{padding:48px 0;border-top:1px solid rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.05);overflow:hidden}.marquee{display:flex;animation:marquee 30s linear infinite}.marquee-content{display:flex;align-items:center;flex-shrink:0}.marquee-item{font-size:clamp(32px, 6vw, 80px);font-weight:700;text-transform:uppercase;letter-spacing:-0.02em;padding:0 32px;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,0.3);transition:all 0.3s}.marquee-item:hover{-webkit-text-stroke-color:var(--accent);color:var(--accent);transform:scale(1.1)}.marquee-item{transition:all 0.3s ease}.marquee-dot{width:12px;height:12px;background:var(--accent);border-radius:50%;flex-shrink:0}@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}/* Services Bento */ .services{padding:160px 48px}.section-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:80px}.section-title{font-size:clamp(32px, 5vw, 64px);font-weight:700;letter-spacing:-0.03em;max-width:600px}.section-count{font-size:0.8rem;color:var(--gray);text-transform:uppercase;letter-spacing:0.15em}.bento-grid{display:grid;grid-template-columns:repeat(12, 1fr);grid-template-rows:repeat(2, 320px);gap:20px}.bento-card{background:rgba(255,255,255,0.03);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.08);border-radius:24px;padding:40px;position:relative;overflow:hidden;transition:all 0.5s cubic-bezier(0.16, 1, 0.3, 1);cursor:none;box-shadow:0 4px 24px -1px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.05)}.bento-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(99, 102, 241, 0.2) 0%, transparent 50%);opacity:0;transition:opacity 0.3s}.bento-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent)}.bento-card:hover::before{opacity:1}.bento-card:hover{border-color:rgba(99, 102, 241, 0.4);transform:translateY(-8px);box-shadow:0 20px 40px -10px rgba(99, 102, 241, 0.3), inset 0 1px 0 rgba(255,255,255,0.1)}.bento-card.span-6{grid-column:span 6}.bento-card.span-4{grid-column:span 4}.bento-card.span-3{grid-column:span 3}.bento-card.span-8{grid-column:span 8}.bento-card.tall{grid-row:span 2}.bento-icon{width:56px;height:56px;background:linear-gradient(135deg, var(--accent), var(--accent-2));border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:32px}.bento-icon svg{width:28px;height:28px;stroke:#000}.bento-card h3{font-size:1.5rem;font-weight:600;margin-bottom:16px;letter-spacing:-0.02em}.bento-card p{color:var(--gray);font-size:1rem;line-height:1.6}.bento-number{font-size:5rem;font-weight:700;background:linear-gradient(180deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.bento-label{font-size:0.8rem;color:var(--gray);text-transform:uppercase;letter-spacing:0.15em;margin-top:8px}/* Portfolio */ .portfolio{padding:160px 48px}.portfolio-list{display:flex;flex-direction:column;gap:2px}.portfolio-item{display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;padding:48px 0;border-bottom:1px solid rgba(255,255,255,0.05);cursor:none;position:relative;transition:all 0.3s}.portfolio-item::before{content:'';position:absolute;left:0;right:0;top:0;bottom:0;background:linear-gradient(90deg, transparent, rgba(99, 102, 241, 0.05), transparent);opacity:0;transition:opacity 0.3s}.portfolio-item:hover::before{opacity:1}.portfolio-item:hover{padding-left:24px}.portfolio-num{font-size:0.8rem;color:var(--gray);font-family:monospace}.portfolio-title{font-size:clamp(32px, 5vw, 64px);font-weight:700;letter-spacing:-0.03em;transition:color 0.3s}.portfolio-item:hover .portfolio-title{color:var(--accent)}.portfolio-item:hover .portfolio-num{color:var(--accent)}.portfolio-category{text-align:right;font-size:0.85rem;color:var(--gray);text-transform:uppercase;letter-spacing:0.1em}.portfolio-image{position:fixed;width:400px;height:300px;border-radius:16px;pointer-events:none;z-index:100;opacity:0;transform:scale(0.8);transition:opacity 0.3s, transform 0.3s;overflow:hidden}.portfolio-image.visible{opacity:1;transform:scale(1)}.portfolio-image-inner{width:100%;height:100%;background:linear-gradient(135deg, var(--accent), var(--accent-2))}/* CTA */ .cta{padding:200px 48px;text-align:center;position:relative}.cta-title{font-size:clamp(48px, 10vw, 140px);font-weight:700;letter-spacing:-0.04em;line-height:1;margin-bottom:48px}.cta-title .line{display:block;overflow:hidden}.cta-title .outline{color:transparent;-webkit-text-stroke:1.5px var(--text)}.cta-btn{display:inline-flex;align-items:center;gap:16px;padding:24px 56px;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#fff;text-decoration:none;font-size:1.1rem;font-weight:600;border-radius:100px;transition:all 0.3s;position:relative;overflow:hidden}.cta-btn::before{content:'';position:absolute;inset:2px;background:var(--bg);border-radius:100px;z-index:0;transition:opacity 0.3s}.cta-btn span{position:relative;z-index:1;display:flex;align-items:center;gap:16px}.cta-btn:hover::before{opacity:0}.cta-btn:hover{transform:scale(1.05);box-shadow:0 0 60px rgba(99, 102, 241, 0.5)}.cta-btn:hover::after{content:'';position:absolute;inset:-2px;border-radius:100px;background:linear-gradient(135deg, var(--accent), var(--accent-3), var(--accent-2));z-index:-1;animation:borderGlow 2s linear infinite;background-size:300% 300%}@keyframes borderGlow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}/* CTA Floating Elements */ .cta{overflow:hidden}.floating-shapes{position:absolute;inset:0;pointer-events:none;overflow:hidden}.floating-shape{position:absolute;border-radius:50%;opacity:0.1;animation:float 20s ease-in-out infinite}.floating-shape:nth-child(1){width:100px;height:100px;background:var(--accent);top:20%;left:10%;animation-delay:0s}.floating-shape:nth-child(2){width:60px;height:60px;background:var(--accent-2);top:60%;right:15%;animation-delay:-5s}.floating-shape:nth-child(3){width:80px;height:80px;background:var(--accent-3);bottom:20%;left:20%;animation-delay:-10s}.floating-shape:nth-child(4){width:40px;height:40px;border:2px solid var(--accent);background:transparent;top:30%;right:25%;animation-delay:-15s}@keyframes float{0%, 100%{transform:translate(0, 0) rotate(0deg)}25%{transform:translate(20px, -30px) rotate(90deg)}50%{transform:translate(-20px, 20px) rotate(180deg)}75%{transform:translate(30px, 10px) rotate(270deg)}}/* Footer */ footer{padding:80px 48px;border-top:1px solid rgba(255,255,255,0.05)}.footer-status{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:rgba(74, 222, 128, 0.15);border:1px solid rgba(74, 222, 128, 0.3);border-radius:100px;margin-top:16px;font-size:0.8rem;color:#86efac}.status-dot{width:8px;height:8px;background:#22c55e;border-radius:50%;animation:statusPulse 2s ease-in-out infinite}@keyframes statusPulse{0%, 100%{opacity:1;box-shadow:0 0 0 0 rgba(34, 197, 94, 0.4)}50%{opacity:0.6;box-shadow:0 0 0 8px rgba(34, 197, 94, 0)}}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:48px;margin-bottom:80px}.footer-brand p{color:var(--gray);font-size:0.95rem;line-height:1.7;margin-top:24px;max-width:300px}.footer-col h4{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.15em;color:var(--gray);margin-bottom:24px}.footer-col a{display:block;color:var(--text);text-decoration:none;font-size:0.95rem;padding:8px 0;transition:color 0.3s, transform 0.3s}.footer-col a:hover{color:var(--accent);transform:translateX(8px)}.footer-address{font-size:0.9rem;color:var(--gray);line-height:1.6;margin-top:8px}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:40px;border-top:1px solid rgba(255,255,255,0.05);color:var(--gray);font-size:0.85rem}.social-links{display:flex;gap:24px}.social-links a{color:var(--gray);transition:color 0.3s, transform 0.3s}.social-links a:hover{color:var(--accent);transform:translateY(-4px)}/* Scroll Progress */ .scroll-progress{position:fixed;top:0;left:0;width:0%;height:2px;background:linear-gradient(90deg, var(--accent), var(--accent-3));z-index:10001;transition:width 0.1s}/* Mobile Menu Button */ .menu-btn{display:none;position:relative;width:44px;height:44px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:10px;cursor:pointer;z-index:1001}.menu-btn span{position:absolute;width:18px;height:2px;background:#fff;left:50%;margin-left:-9px;transition:all 0.3s ease}.menu-btn span:nth-child(1){top:14px}.menu-btn span:nth-child(2){top:21px}.menu-btn span:nth-child(3){top:28px}.menu-btn.active{background:var(--accent);border-color:var(--accent)}.menu-btn.active span:nth-child(1){top:21px;transform:rotate(45deg)}.menu-btn.active span:nth-child(2){opacity:0}.menu-btn.active span:nth-child(3){top:21px;transform:rotate(-45deg)}/* Mobile Menu */ .mobile-menu{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.98);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);z-index:999;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;opacity:0;pointer-events:none;transition:opacity 0.5s;padding-top:80px}.mobile-menu.active{opacity:1;pointer-events:auto}.mobile-menu a{font-size:clamp(32px, 8vw, 48px);font-weight:700;color:var(--text);text-decoration:none;letter-spacing:-0.02em;opacity:0;transform:translateY(20px);transition:all 0.4s}.mobile-menu.active a{opacity:1;transform:translateY(0)}.mobile-menu.active a:nth-child(1){transition-delay:0.1s}.mobile-menu.active a:nth-child(2){transition-delay:0.2s}.mobile-menu.active a:nth-child(3){transition-delay:0.3s}.mobile-menu a:hover{color:var(--accent)}/* Back to Top */ .back-to-top{position:fixed;bottom:32px;right:32px;width:48px;height:48px;background:rgba(255,255,255,0.05);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text);cursor:pointer;opacity:0;transform:translateY(20px);transition:all 0.3s;z-index:100;box-shadow:0 4px 20px rgba(0,0,0,0.2)}.back-to-top.visible{opacity:1;transform:translateY(0)}.back-to-top:hover{background:rgba(99, 102, 241, 0.3);border-color:var(--accent);box-shadow:0 4px 30px rgba(99, 102, 241, 0.4)}/* Tablet */ @media (max-width:1024px){.bento-card.span-6{grid-column:span 6}.bento-card.span-4, .bento-card.span-3{grid-column:span 6}.bento-card.span-8{grid-column:span 12}.bento-card.tall{grid-row:span 1}.bento-grid{grid-template-rows:auto}.footer-grid{grid-template-columns:1fr 1fr 1fr}.stats{gap:48px}.stat-number{font-size:2.5rem}}/* Mobile */ @media (max-width:768px){nav{padding:16px 24px;background:rgba(0,0,0,0.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.menu-btn{display:block}.nav-links{display:none}.logo-activity{display:flex}/* Hero Mobile */ .hero{min-height:auto;padding:100px 24px 40px;justify-content:flex-start}.hero-content{display:flex;flex-direction:column}.hero-eyebrow{margin-bottom:20px;font-size:0.65rem;letter-spacing:0.15em}.hero-eyebrow::before{width:24px}.hero-title{font-size:clamp(36px, 11vw, 56px);margin-bottom:20px;line-height:1}.hero-title .outline{-webkit-text-stroke-width:1px}.hero-desc{font-size:0.95rem;margin-bottom:28px;line-height:1.6;max-width:100%}.hero-cta{flex-direction:column;align-items:stretch;gap:12px;width:100%}.magnetic-btn{text-align:center;justify-content:center;padding:16px 28px;font-size:0.85rem}.magnetic-btn span{justify-content:center}.play-btn{justify-content:center;padding:8px 0}.play-circle{width:48px;height:48px}.stats{position:static;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:32px;padding-top:0}.stat{text-align:left;padding:16px;background:rgba(255,255,255,0.03);border-radius:12px;border:1px solid rgba(255,255,255,0.05)}.stat-number{font-size:1.75rem}.stat-label{font-size:0.6rem;margin-top:4px}/* Marquee Mobile */ .marquee-section{padding:20px 0;margin-top:0}.marquee-item{font-size:20px;padding:0 12px;-webkit-text-stroke-width:0.5px}.marquee-dot{width:6px;height:6px}/* Services Mobile */ .services{padding:60px 24px}.section-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:32px}.section-title{font-size:24px;line-height:1.2}.section-count{font-size:0.7rem}.bento-grid{gap:12px;grid-template-columns:1fr 1fr;grid-template-rows:auto}.bento-card{padding:20px;border-radius:16px}.bento-card.span-6{grid-column:span 2}.bento-card.span-4{grid-column:span 2}.bento-card.span-3{grid-column:span 1}.bento-card.span-8{grid-column:span 2}.bento-icon{width:40px;height:40px;border-radius:10px;margin-bottom:16px}.bento-icon svg{width:20px;height:20px}.bento-card h3{font-size:1.1rem;margin-bottom:8px}.bento-card p{font-size:0.8rem;line-height:1.5}.bento-number{font-size:2rem;line-height:1.2}.bento-label{font-size:0.65rem}/* Portfolio Mobile */ .portfolio{padding:60px 24px}.portfolio-item{grid-template-columns:auto 1fr;gap:12px 16px;padding:20px 0;align-items:baseline}.portfolio-num{font-size:0.7rem;color:var(--accent)}.portfolio-title{font-size:20px;grid-column:2;grid-row:1}.portfolio-category{grid-column:2;grid-row:2;text-align:left;font-size:0.7rem;margin-top:-8px}.portfolio-image{display:none}/* CTA Mobile */ .cta{padding:80px 24px}.cta-title{font-size:28px;margin-bottom:28px;line-height:1.1}.cta-title .outline{-webkit-text-stroke-width:1px}.cta-btn{padding:16px 32px;font-size:0.9rem;width:100%;justify-content:center}.cta-btn span{justify-content:center}/* Footer Mobile */ footer{padding:48px 24px}.footer-grid{grid-template-columns:repeat(3, 1fr);gap:32px 24px;margin-bottom:40px}.footer-brand{grid-column:span 3}.footer-brand p{margin-top:12px;font-size:0.85rem}.footer-col h4{margin-bottom:12px;font-size:0.7rem}.footer-col a{padding:6px 0;font-size:0.85rem}.footer-bottom{flex-direction:column;gap:16px;text-align:center;padding-top:24px;font-size:0.8rem}.social-links{gap:20px}/* Hide custom cursor on touch */ .cursor, .cursor-text{display:none}body{cursor:auto}.back-to-top{bottom:20px;right:20px;width:44px;height:44px}/* Disable hover effects on touch */ .bento-card:hover{transform:none}.portfolio-item:hover{padding-left:0}.magnetic-btn:hover::before{transform:scaleX(0)}.bento-card::before{display:none}/* Gradient orbs smaller on mobile */ .orb-1{width:300px;height:300px;top:-100px;right:-100px}.orb-2{width:250px;height:250px;bottom:-80px;left:-80px}.orb-3{width:200px;height:200px}/* Grid overlay less visible */ .grid-overlay{background-size:40px 40px}}/* Small Mobile */ @media (max-width:420px){nav{padding:14px 20px}.hero{padding:90px 20px 40px}.hero-title{font-size:32px}.hero-desc{font-size:0.9rem}.stats{grid-template-columns:1fr 1fr;gap:12px}.stat{padding:12px}.stat-number{font-size:1.5rem}.services, .portfolio, .cta, footer{padding-left:20px;padding-right:20px}.section-title{font-size:22px}.bento-grid{grid-template-columns:1fr}.bento-card.span-3{grid-column:span 1}.bento-number{font-size:2.5rem}.portfolio-title{font-size:18px}.cta-title{font-size:24px}.footer-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-brand{grid-column:span 2}}/* Reduced Motion */ @media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important}.preloader{display:none}body.loading{overflow:auto}.hero-title .word{transform:none;opacity:1}}/* Dark mode improvements */ @media (prefers-color-scheme:light){:root{--bg:#ffffff;--text:#0a0a0a;--gray:#6b7280}.gradient-orb{opacity:0.3}.grid-overlay{background-image:linear-gradient(rgba(0,0,0,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,0.03) 1px, transparent 1px)}.bento-card{background:rgba(0,0,0,0.02);border-color:rgba(0,0,0,0.05)}.bento-card:hover{border-color:rgba(99, 102, 241, 0.2)}}/* ==================== CONTACT PAGE ==================== */ .contact-hero{min-height:50vh;display:flex;align-items:center;padding:160px 48px 80px}.contact-hero-content{max-width:800px}.page-title{font-size:clamp(2.5rem, 8vw, 5rem);font-weight:700;line-height:1.1;margin:16px 0 0}.page-title .line{display:block}.page-title .word{display:inline-block}.page-title .word.gradient{background:linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #06b6d4 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}/* Contact Section */ .contact-section{padding:0 48px 100px}.contact-grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:80px;max-width:1400px;margin:0 auto}/* Contact Form */ .contact-form-wrapper{position:relative}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:32px}.form-group{position:relative}.form-group.full-width{grid-column:span 2}.form-row{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:32px}/* Honeypot field - hidden from users */ .hp-field{position:absolute;left:-9999px;opacity:0;pointer-events:none}.form-group label{display:block;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:1px;color:var(--gray);margin-bottom:12px}.form-group label .optional{font-weight:400;text-transform:none;letter-spacing:0;opacity:0.6}.form-group input, .form-group select, .form-group textarea{width:100%;padding:16px 0;font-size:16px;font-family:inherit;color:var(--text);background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,0.1);outline:none;transition:all 0.3s ease}.form-group input::placeholder, .form-group textarea::placeholder{color:var(--gray);opacity:0.5}.form-group select{cursor:pointer;appearance:none;padding-right:32px}.form-group select option{background:#1a1a1a;color:var(--text);padding:12px}.select-arrow{position:absolute;right:0;bottom:18px;width:16px;height:16px;color:var(--gray);pointer-events:none;transition:transform 0.3s ease}.form-group select:focus ~ .select-arrow{transform:rotate(180deg)}.input-line{position:absolute;bottom:0;left:0;width:0;height:2px;background:linear-gradient(90deg, #6366f1, #8b5cf6);transition:width 0.4s ease}.form-group input:focus ~ .input-line, .form-group select:focus ~ .input-line, .form-group textarea:focus ~ .input-line{width:100%}.form-group textarea{resize:vertical;min-height:120px}/* Submit Button */ .submit-btn{grid-column:span 2;display:flex;align-items:center;justify-content:center;gap:12px;padding:20px 48px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:#fff;background:linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);border:none;border-radius:60px;cursor:pointer;overflow:hidden;position:relative;transition:all 0.4s ease}.submit-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, #8b5cf6 0%, #06b6d4 100%);opacity:0;transition:opacity 0.4s ease}.submit-btn:hover::before{opacity:1}.submit-btn .btn-text, .submit-btn .btn-icon{position:relative;z-index:1;transition:transform 0.3s ease}.submit-btn .btn-icon svg{width:18px;height:18px}.submit-btn:hover .btn-icon{transform:translate(4px, -4px)}.submit-btn .btn-loading{position:absolute;opacity:0;transition:opacity 0.3s ease}.submit-btn .spinner{width:24px;height:24px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.submit-btn.loading .btn-text, .submit-btn.loading .btn-icon{opacity:0}.submit-btn.loading .btn-loading{opacity:1}/* Form Success */ .form-success{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(10, 10, 10, 0.95);backdrop-filter:blur(20px);opacity:0;visibility:hidden;transition:all 0.5s ease}.form-success.visible{opacity:1;visibility:visible}.success-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(139, 92, 246, 0.2));border-radius:50%;margin-bottom:24px}.success-icon svg{width:40px;height:40px;color:#6366f1}.form-success h3{font-size:24px;font-weight:600;margin-bottom:8px}.form-success p{color:var(--gray)}/* Contact Info */ .contact-info{display:flex;flex-direction:column;gap:24px}.info-card{display:flex;align-items:flex-start;gap:20px;padding:24px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:16px;backdrop-filter:blur(10px);transition:all 0.3s ease}.info-card:hover{background:rgba(255,255,255,0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-4px)}.info-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:12px;flex-shrink:0}.info-icon svg{width:24px;height:24px;stroke:#6366f1}.info-content h4{font-size:14px;font-weight:600;margin-bottom:4px}.info-content a, .info-content p{font-size:14px;color:var(--gray);text-decoration:none;transition:color 0.3s ease;line-height:1.6}.info-content a:hover{color:#6366f1}/* Contact Social */ .contact-social{margin-top:16px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.05)}.contact-social h4{font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:1px;color:var(--gray);margin-bottom:16px}.social-grid{display:flex;gap:12px}.social-link{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:12px;color:var(--gray);transition:all 0.3s ease}.social-link svg{width:20px;height:20px}.social-link:hover{background:linear-gradient(135deg, #6366f1, #8b5cf6);border-color:transparent;color:#fff;transform:translateY(-4px)}/* Map Section */ .map-section{position:relative;height:500px;margin:0 48px 100px;border-radius:24px;overflow:hidden}.map-iframe, .map-section iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(100%) invert(92%) contrast(90%);transition:filter 0.4s ease}.map-section:hover .map-iframe, .map-section:hover iframe{filter:grayscale(50%) invert(92%) contrast(90%)}.map-overlay{position:absolute;top:32px;left:32px;z-index:10}.map-card{padding:32px;background:rgba(10, 10, 10, 0.8);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.1);border-radius:20px;max-width:300px}.map-card h3{font-size:18px;font-weight:600;margin-bottom:12px}.map-card p{font-size:14px;color:var(--gray);line-height:1.6;margin-bottom:20px}.map-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#6366f1;text-decoration:none;transition:gap 0.3s ease}.map-link svg{width:16px;height:16px}.map-link:hover{gap:12px}/* Contact Page Responsive */ @media (max-width:1024px){.contact-grid{grid-template-columns:1fr;gap:60px}.contact-info{order:-1;display:grid;grid-template-columns:repeat(2, 1fr);gap:16px}.contact-social{grid-column:span 2}}@media (max-width:768px){.contact-hero{padding:140px 24px 60px;min-height:auto}.contact-section{padding:0 24px 60px}.contact-form{grid-template-columns:1fr;gap:24px}.form-group.full-width{grid-column:span 1}.submit-btn{grid-column:span 1;width:100%}.contact-info{grid-template-columns:1fr}.contact-social{grid-column:span 1}.map-section{height:450px;margin:0 24px 60px;border-radius:16px}.map-overlay{top:16px;left:16px;right:16px}.map-card{padding:20px;max-width:none}.map-card h3{font-size:16px;margin-bottom:8px}.map-card p{font-size:13px;margin-bottom:16px}}@media (max-width:420px){.contact-hero{padding:120px 16px 40px}.contact-section{padding:0 16px 40px}.page-title{font-size:2rem}.info-card{padding:16px}.map-section{height:500px;margin:0;border-radius:0}.map-overlay{top:12px;left:12px;right:12px}.map-card{padding:16px}.map-card h3{font-size:15px}.map-card p{font-size:12px;line-height:1.5}.map-link{font-size:13px}}/* ==================== 404 PAGE - CYBERPUNK ==================== */ .error-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:120px 24px;position:relative;overflow:hidden;background:#0a0a0a}/* Matrix Background */ .matrix-bg{position:absolute;inset:0;z-index:0;opacity:0.15}/* Scanlines */ .scanlines{position:absolute;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient( 0deg, rgba(0, 0, 0, 0.1) 0px, rgba(0, 0, 0, 0.1) 1px, transparent 1px, transparent 2px )}.scanlines::before{content:'';position:absolute;inset:0;background:linear-gradient( 180deg, transparent 0%, rgba(6, 182, 212, 0.03) 50%, transparent 100% );animation:scanline 8s linear infinite}@keyframes scanline{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}.error-content{text-align:center;position:relative;z-index:10}/* Glitch 404 */ .glitch-wrapper{margin-bottom:48px}.glitch{font-size:clamp(100px, 25vw, 250px);font-weight:700;color:#fff;position:relative;text-shadow:0 0 10px #6366f1, 0 0 20px #6366f1, 0 0 40px #6366f1, 0 0 80px #8b5cf6;animation:glitch-skew 4s infinite linear alternate-reverse}.glitch::before, .glitch::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%}.glitch::before{color:#06b6d4;animation:glitch-effect 3s infinite linear alternate-reverse;clip-path:polygon(0 0, 100% 0, 100% 35%, 0 35%);transform:translate(-3px, -3px);opacity:0.8}.glitch::after{color:#ec4899;animation:glitch-effect 2s infinite linear alternate-reverse;clip-path:polygon(0 65%, 100% 65%, 100% 100%, 0 100%);transform:translate(3px, 3px);opacity:0.8}@keyframes glitch-effect{0%{transform:translate(0)}20%{transform:translate(-3px, 3px)}40%{transform:translate(-3px, -3px)}60%{transform:translate(3px, 3px)}80%{transform:translate(3px, -3px)}100%{transform:translate(0)}}@keyframes glitch-skew{0%{transform:skew(0deg)}10%{transform:skew(1deg)}20%{transform:skew(-1deg)}30%{transform:skew(0.5deg)}40%{transform:skew(-0.5deg)}50%{transform:skew(0deg)}100%{transform:skew(0deg)}}/* Terminal */ .terminal{max-width:500px;margin:0 auto 48px;background:rgba(0, 0, 0, 0.8);border:1px solid rgba(99, 102, 241, 0.3);border-radius:12px;overflow:hidden;backdrop-filter:blur(10px);box-shadow:0 0 20px rgba(99, 102, 241, 0.1), inset 0 0 60px rgba(99, 102, 241, 0.03)}.terminal-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:rgba(255, 255, 255, 0.03);border-bottom:1px solid rgba(255, 255, 255, 0.05)}.terminal-dot{width:12px;height:12px;border-radius:50%}.terminal-dot.red{background:#ff5f57}.terminal-dot.yellow{background:#ffbd2e}.terminal-dot.green{background:#28c840}.terminal-title{margin-left:auto;font-size:12px;color:var(--gray);font-family:monospace}.terminal-body{padding:20px;text-align:left}.terminal-line{font-family:'Courier New', monospace;font-size:14px;color:rgba(255, 255, 255, 0.7);margin-bottom:8px;line-height:1.6}.terminal-line:last-child{margin-bottom:0}.terminal-line .prompt{color:#6366f1;margin-right:8px}.terminal-line .command{color:#06b6d4}.terminal-line .highlight{color:#ec4899;font-weight:600}.terminal-line.error-text{color:#ef4444}.terminal-line .cursor{animation:blink 1s infinite;color:#6366f1}@keyframes blink{0%, 50%{opacity:1}51%, 100%{opacity:0}}/* Cyber Buttons */ .error-actions{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:48px}.cyber-btn{position:relative;padding:16px 40px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:#fff;text-decoration:none;background:linear-gradient(135deg, #6366f1, #8b5cf6);clip-path:polygon( 0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%, 0 calc(100% - 15px) );transition:all 0.3s ease;overflow:hidden}.cyber-btn::before{content:'';position:absolute;inset:2px;background:#0a0a0a;clip-path:polygon( 0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px) );z-index:-1;transition:all 0.3s ease}.cyber-btn:hover::before{background:transparent}.cyber-btn:hover{box-shadow:0 0 20px rgba(99, 102, 241, 0.5), 0 0 40px rgba(99, 102, 241, 0.3);transform:translateY(-2px)}.cyber-btn-text{position:relative;z-index:1}.cyber-btn-glitch{position:absolute;inset:0;background:linear-gradient(135deg, #06b6d4, #8b5cf6);opacity:0;transition:opacity 0.1s}.cyber-btn:hover .cyber-btn-glitch{animation:btn-glitch 0.3s linear}@keyframes btn-glitch{0%, 100%{opacity:0;transform:translate(0)}20%{opacity:0.8;transform:translate(-2px, 2px)}40%{opacity:0.8;transform:translate(2px, -2px)}60%{opacity:0.8;transform:translate(-1px, 1px)}80%{opacity:0;transform:translate(1px, -1px)}}.cyber-btn-tag{position:absolute;right:-1px;bottom:-1px;padding:2px 6px;font-size:8px;background:#ec4899;color:#fff;clip-path:polygon(5px 0, 100% 0, 100% 100%, 0 100%)}.cyber-btn.alt{background:linear-gradient(135deg, #06b6d4, #0891b2)}.cyber-btn.alt .cyber-btn-tag{background:#6366f1}/* Coordinates */ .coordinates{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;font-family:monospace;font-size:12px;color:var(--gray);text-transform:uppercase;letter-spacing:1px}.coordinates .separator{color:#6366f1}.coordinates .status-error{color:#ef4444;animation:blink 1s infinite}/* Corner Decorations */ .corner-decor{position:absolute;width:80px;height:80px;z-index:5;pointer-events:none}.corner-decor::before, .corner-decor::after{content:'';position:absolute;background:#6366f1}.corner-decor.top-left{top:40px;left:40px}.corner-decor.top-left::before{width:40px;height:2px;top:0;left:0}.corner-decor.top-left::after{width:2px;height:40px;top:0;left:0}.corner-decor.top-right{top:40px;right:40px}.corner-decor.top-right::before{width:40px;height:2px;top:0;right:0}.corner-decor.top-right::after{width:2px;height:40px;top:0;right:0}.corner-decor.bottom-left{bottom:40px;left:40px}.corner-decor.bottom-left::before{width:40px;height:2px;bottom:0;left:0}.corner-decor.bottom-left::after{width:2px;height:40px;bottom:0;left:0}.corner-decor.bottom-right{bottom:40px;right:40px}.corner-decor.bottom-right::before{width:40px;height:2px;bottom:0;right:0}.corner-decor.bottom-right::after{width:2px;height:40px;bottom:0;right:0}/* Side Lines */ .side-line{position:absolute;top:50%;transform:translateY(-50%);width:2px;height:200px;z-index:5}.side-line::before{content:'';position:absolute;inset:0;background:linear-gradient( 180deg, transparent 0%, #6366f1 50%, transparent 100% );animation:line-pulse 2s ease-in-out infinite}.side-line.left{left:40px}.side-line.right{right:40px}@keyframes line-pulse{0%, 100%{opacity:0.3}50%{opacity:1}}/* 404 Responsive */ @media (max-width:768px){.error-page{padding:100px 16px}.terminal{margin:0 auto 32px}.terminal-line{font-size:12px}.error-actions{flex-direction:column;gap:16px}.cyber-btn{width:100%;max-width:280px;text-align:center}.coordinates{flex-direction:column;gap:8px}.coordinates .separator{display:none}.corner-decor, .side-line{display:none}}@media (max-width:420px){.glitch{font-size:80px}.terminal-body{padding:16px}.terminal-line{font-size:11px}}/* ==================== ABOUT PAGE ==================== */ /* About Hero */ .about-hero{min-height:80vh;display:flex;align-items:center;justify-content:space-between;padding:160px 48px 100px;position:relative}.about-hero-content{max-width:700px}.about-hero-desc{font-size:18px;color:var(--gray);line-height:1.7;margin-top:24px;max-width:500px}.about-hero-year{display:flex;flex-direction:column;align-items:center;gap:8px}.year-since{font-size:14px;text-transform:uppercase;letter-spacing:3px;color:var(--gray)}.year-number{font-size:clamp(80px, 15vw, 180px);font-weight:700;line-height:1;background:linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(139, 92, 246, 0.2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}/* About Stats */ .about-stats{padding:0 48px 100px}.stats-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:24px}.stat-card{padding:40px 32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;text-align:center;backdrop-filter:blur(10px);transition:all 0.3s ease}.stat-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-8px)}.stat-icon{width:56px;height:56px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:16px}.stat-icon svg{width:28px;height:28px;stroke:#6366f1}.stat-card .stat-number{font-size:48px;font-weight:700;background:linear-gradient(135deg, #6366f1, #8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-card .stat-label{font-size:14px;color:var(--gray);margin-top:8px}/* About Story */ .about-story{padding:100px 48px;background:rgba(255, 255, 255, 0.01)}.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;max-width:1200px;margin:0 auto}.story-content .section-title{margin-bottom:32px}.story-text{font-size:16px;color:var(--gray);line-height:1.8;margin-bottom:20px}.story-signature{display:flex;align-items:center;gap:16px;margin-top:40px;font-size:14px;color:var(--text);font-weight:500}.signature-line{width:40px;height:2px;background:linear-gradient(90deg, #6366f1, #8b5cf6)}.story-visual{display:grid;grid-template-columns:1fr 1fr;gap:20px}.visual-card{padding:32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:16px;display:flex;flex-direction:column;gap:8px;transition:all 0.3s ease}.visual-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.3);transform:scale(1.02)}.visual-card.card-1{animation:float 6s ease-in-out infinite}.visual-card.card-2{animation:float 6s ease-in-out infinite 1s}.visual-card.card-3{animation:float 6s ease-in-out infinite 2s}.visual-card.card-4{animation:float 6s ease-in-out infinite 3s}@keyframes float{0%, 100%{transform:translateY(0)}50%{transform:translateY(-10px)}}.visual-year{font-size:32px;font-weight:700;background:linear-gradient(135deg, #6366f1, #8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.visual-text{font-size:14px;color:var(--gray)}/* About Values */ .about-values{padding:100px 48px}.values-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:24px;margin-top:60px}.value-card{padding:40px 32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;transition:all 0.3s ease;position:relative;overflow:hidden}.value-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg, #6366f1, #8b5cf6, #06b6d4);transform:scaleX(0);transform-origin:left;transition:transform 0.4s ease}.value-card:hover::before{transform:scaleX(1)}.value-card:hover{background:rgba(255, 255, 255, 0.04);transform:translateY(-8px)}.value-number{font-size:48px;font-weight:700;color:rgba(99, 102, 241, 0.15);margin-bottom:16px}.value-title{font-size:20px;font-weight:600;margin-bottom:12px}.value-desc{font-size:14px;color:var(--gray);line-height:1.7}/* About Timeline */ .about-timeline{padding:100px 48px;background:rgba(255, 255, 255, 0.01)}.timeline{max-width:800px;margin:60px auto 0;position:relative}.timeline-line{position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg, #6366f1, #8b5cf6, #06b6d4)}.timeline-item{position:relative;padding-left:48px;padding-bottom:48px}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-7px;top:4px;width:16px;height:16px;background:#0a0a0a;border:3px solid #6366f1;border-radius:50%;transition:all 0.3s ease}.timeline-item:hover .timeline-dot{background:#6366f1;box-shadow:0 0 20px rgba(99, 102, 241, 0.5)}.timeline-content{padding:24px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:16px;transition:all 0.3s ease}.timeline-item:hover .timeline-content{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2)}.timeline-year{display:inline-block;padding:4px 12px;background:linear-gradient(135deg, rgba(99, 102, 241, 0.2), rgba(139, 92, 246, 0.2));border-radius:20px;font-size:12px;font-weight:600;color:#6366f1;margin-bottom:12px}.timeline-content h3{font-size:18px;font-weight:600;margin-bottom:8px}.timeline-content p{font-size:14px;color:var(--gray);line-height:1.6}/* About Services Bento */ .about-services{padding:100px 48px}.services-bento{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px;margin-top:60px}.service-bento-card{padding:40px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;transition:all 0.3s ease}.service-bento-card.large{grid-row:span 2}.service-bento-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-8px)}.service-bento-card .service-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:16px;margin-bottom:24px}.service-bento-card .service-icon svg{width:28px;height:28px;stroke:#6366f1}.service-bento-card h3{font-size:20px;font-weight:600;margin-bottom:12px}.service-bento-card p{font-size:14px;color:var(--gray);line-height:1.7}.service-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.service-tags span{padding:6px 14px;background:rgba(99, 102, 241, 0.1);border-radius:20px;font-size:12px;color:#6366f1}/* About CTA */ .about-cta{padding:100px 48px;text-align:center}.cta-content h2{font-size:clamp(32px, 5vw, 48px);font-weight:700;margin-bottom:16px}.cta-content p{font-size:18px;color:var(--gray);margin-bottom:40px}/* About Page Responsive */ @media (max-width:1024px){.about-hero{flex-direction:column;text-align:center;gap:60px}.about-hero-content{max-width:100%}.about-hero-desc{max-width:100%}.stats-grid{grid-template-columns:repeat(2, 1fr)}.story-grid{grid-template-columns:1fr;gap:60px}.values-grid{grid-template-columns:repeat(2, 1fr)}.services-bento{grid-template-columns:1fr}.service-bento-card.large{grid-row:span 1}}@media (max-width:768px){.about-hero{padding:140px 24px 60px;min-height:auto}.about-stats{padding:0 24px 60px}.about-story{padding:60px 24px}.about-values{padding:60px 24px}.about-timeline{padding:60px 24px}.about-services{padding:60px 24px}.about-cta{padding:60px 24px}.stats-grid{grid-template-columns:1fr 1fr;gap:16px}.stat-card{padding:24px 16px}.stat-card .stat-number{font-size:36px}.story-visual{grid-template-columns:1fr 1fr;gap:16px}.visual-card{padding:20px}.values-grid{grid-template-columns:1fr;gap:16px}.value-card{padding:24px}.timeline-item{padding-left:32px;padding-bottom:32px}}@media (max-width:420px){.about-hero{padding:120px 16px 40px}.year-number{font-size:80px}.stats-grid{grid-template-columns:1fr}.story-visual{grid-template-columns:1fr}.about-stats, .about-story, .about-values, .about-timeline, .about-services, .about-cta{padding-left:16px;padding-right:16px}}/* ==================== SERVICES PAGE ==================== */ /* Services Hero */ .services-hero{min-height:60vh;display:flex;align-items:center;padding:160px 48px 80px}.services-hero-content{max-width:800px}.services-hero-desc{font-size:18px;color:var(--gray);line-height:1.7;margin-top:24px;max-width:600px}/* Services Main */ .services-main{padding:0 48px 100px}.services-list{display:flex;flex-direction:column;gap:24px}.service-card-large{display:grid;grid-template-columns:80px 1fr 60px;gap:40px;align-items:center;padding:48px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:24px;text-decoration:none;color:inherit;transition:all 0.4s ease;position:relative;overflow:hidden}.service-card-large::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, rgba(99, 102, 241, 0.05), rgba(139, 92, 246, 0.05));opacity:0;transition:opacity 0.4s ease}.service-card-large:hover::before{opacity:1}.service-card-large:hover{border-color:rgba(99, 102, 241, 0.3);transform:translateY(-8px)}.service-card-number{font-size:64px;font-weight:700;color:rgba(99, 102, 241, 0.15);line-height:1;position:relative}.service-card-content{position:relative}.service-card-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:16px;margin-bottom:20px}.service-card-icon svg{width:28px;height:28px;stroke:#6366f1}.service-card-content h2{font-size:28px;font-weight:600;margin-bottom:12px}.service-card-content p{font-size:15px;color:var(--gray);line-height:1.7;margin-bottom:20px}.service-card-features{display:flex;flex-wrap:wrap;gap:8px}.service-card-features span{padding:8px 16px;background:rgba(99, 102, 241, 0.1);border-radius:20px;font-size:13px;color:#6366f1}.service-card-arrow{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.05);border-radius:50%;transition:all 0.3s ease;position:relative}.service-card-arrow svg{width:24px;height:24px;stroke:var(--gray);transition:all 0.3s ease}.service-card-large:hover .service-card-arrow{background:linear-gradient(135deg, #6366f1, #8b5cf6)}.service-card-large:hover .service-card-arrow svg{stroke:#fff;transform:translate(2px, -2px)}/* All Services Section */ .services-all{padding:100px 48px}.services-categories{display:grid;grid-template-columns:repeat(4, 1fr);gap:32px;margin-top:60px}.service-category{background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;padding:32px;transition:all 0.3s ease}.service-category:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.15)}.service-category h3{font-size:18px;font-weight:600;margin-bottom:20px;color:#6366f1}.service-category ul{list-style:none;padding:0;margin:0}.service-category li{padding:10px 0;font-size:14px;color:var(--gray);border-bottom:1px solid rgba(255, 255, 255, 0.04);transition:all 0.2s ease}.service-category li:last-child{border-bottom:none}.service-category li:hover{color:#fff;padding-left:8px}/* Services Process */ .services-process{padding:100px 48px;background:rgba(255, 255, 255, 0.01)}.process-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:24px;margin-top:60px}.process-card{padding:40px 32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;text-align:center;position:relative;transition:all 0.3s ease}.process-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-8px)}.process-number{position:absolute;top:20px;right:20px;font-size:14px;font-weight:600;color:rgba(99, 102, 241, 0.3)}.process-icon{width:64px;height:64px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:20px}.process-icon svg{width:32px;height:32px;stroke:#6366f1}.process-card h3{font-size:18px;font-weight:600;margin-bottom:12px}.process-card p{font-size:14px;color:var(--gray);line-height:1.6}/* Services Tech */ .services-tech{padding:100px 48px}.tech-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:24px;margin-top:60px}.tech-category{padding:32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px}.tech-category h4{font-size:14px;font-weight:600;color:#6366f1;margin-bottom:16px;text-transform:uppercase;letter-spacing:1px}.tech-items{display:flex;flex-wrap:wrap;gap:8px}.tech-items span{padding:8px 14px;background:rgba(255, 255, 255, 0.05);border-radius:8px;font-size:13px;color:var(--gray);transition:all 0.3s ease}.tech-items span:hover{background:rgba(99, 102, 241, 0.1);color:#6366f1}/* Services CTA */ .services-cta{padding:100px 48px;text-align:center;background:rgba(255, 255, 255, 0.01)}/* ==================== SERVICE DETAIL PAGE ==================== */ .service-detail-hero{min-height:50vh;display:flex;align-items:center;padding:160px 48px 80px}.service-detail-hero-content{max-width:700px}.back-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--gray);text-decoration:none;margin-bottom:32px;transition:all 0.3s ease}.back-link svg{width:20px;height:20px}.back-link:hover{color:#6366f1;gap:12px}.service-detail-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:24px;margin-bottom:32px}.service-detail-icon svg{width:40px;height:40px;stroke:#6366f1}.service-detail-desc{font-size:20px;color:var(--gray);line-height:1.7;margin-top:24px}/* Service Detail Stats */ .service-detail-stats{padding:0 48px 80px}/* Service Detail Content */ .service-detail-content{padding:100px 48px;background:rgba(255, 255, 255, 0.01)}/* Service Detail List */ .service-detail-list{display:flex;flex-direction:column;gap:0;margin-top:60px}.service-detail-item{display:flex;align-items:center;gap:32px;padding:32px 0;border-bottom:1px solid rgba(255, 255, 255, 0.06);transition:all 0.3s ease}.service-detail-item:first-child{border-top:1px solid rgba(255, 255, 255, 0.06)}.service-detail-item:hover{background:rgba(255, 255, 255, 0.02);padding-left:24px;padding-right:24px;margin-left:-24px;margin-right:-24px;border-radius:16px}.service-detail-num{font-size:14px;font-weight:700;color:#6366f1;font-family:'Space Grotesk', sans-serif;min-width:32px}.service-detail-info{flex:1}.service-detail-info h3{font-size:20px;font-weight:600;margin-bottom:8px;transition:color 0.3s ease}.service-detail-item:hover .service-detail-info h3{color:#6366f1}.service-detail-info p{font-size:15px;color:var(--gray);line-height:1.6}.service-detail-link{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:12px;color:var(--gray);transition:all 0.3s ease;flex-shrink:0}.service-detail-link svg{width:20px;height:20px;transition:transform 0.3s ease}.service-detail-item:hover .service-detail-link{background:linear-gradient(135deg, #6366f1, #8b5cf6);border-color:transparent;color:white}.service-detail-item:hover .service-detail-link svg{transform:translate(2px, -2px)}/* Legacy grid support */ .service-detail-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:32px;margin-top:60px}.service-detail-card{padding:40px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:24px;transition:all 0.3s ease}.service-detail-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-8px)}.service-detail-card-header{display:flex;align-items:center;gap:16px;margin-bottom:16px}.service-detail-card h3{font-size:22px;font-weight:600}.service-detail-card > p{font-size:15px;color:var(--gray);line-height:1.7;margin-bottom:24px}.service-detail-features{display:flex;flex-wrap:wrap;gap:10px}.feature-tag{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.05);border-radius:8px;font-size:13px;color:var(--gray)}.feature-tag svg{width:14px;height:14px;stroke:#6366f1}/* Other Services */ .other-services{padding:100px 48px}.other-services-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px;margin-top:60px}.other-service-card{display:flex;align-items:center;gap:20px;padding:32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;text-decoration:none;color:inherit;transition:all 0.3s ease}.other-service-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-4px)}.other-service-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:16px;flex-shrink:0}.other-service-icon svg{width:28px;height:28px;stroke:#6366f1}.other-service-card h4{flex:1;font-size:18px;font-weight:600}.other-service-card .arrow{width:24px;height:24px;stroke:var(--gray);transition:all 0.3s ease}.other-service-card:hover .arrow{stroke:#6366f1;transform:translate(4px, -4px)}/* Service Detail CTA */ .service-detail-cta{padding:100px 48px;text-align:center;background:rgba(255, 255, 255, 0.01)}.cta-buttons{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}.cta-btn.secondary{background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(10px)}.cta-btn.secondary span{display:flex;align-items:center;gap:8px}.cta-btn.secondary:hover{background:rgba(255, 255, 255, 0.1);border-color:rgba(99, 102, 241, 0.3)}/* Services Pages Responsive */ @media (max-width:1024px){.service-card-large{grid-template-columns:1fr;gap:24px}.service-card-number{position:absolute;top:24px;right:24px;font-size:48px}.service-card-arrow{display:none}.process-grid{grid-template-columns:repeat(2, 1fr)}.tech-grid{grid-template-columns:repeat(2, 1fr)}.services-categories{grid-template-columns:repeat(2, 1fr)}.service-detail-grid{grid-template-columns:1fr}.other-services-grid{grid-template-columns:1fr}}@media (max-width:768px){.services-hero{padding:140px 24px 60px;min-height:auto}.services-main{padding:0 24px 60px}.services-process, .services-tech, .services-cta{padding:60px 24px}.service-card-large{padding:32px}.service-card-content h2{font-size:22px}.process-grid, .tech-grid{grid-template-columns:1fr}.services-all{padding:60px 24px}.services-categories{grid-template-columns:1fr;gap:24px}.service-category{padding:24px}.service-detail-hero{padding:140px 24px 60px;min-height:auto}.service-detail-stats, .service-detail-content, .other-services, .service-detail-cta{padding:60px 24px}.service-detail-card{padding:24px}.service-detail-item{gap:20px;padding:24px 0}.service-detail-item:hover{padding-left:16px;padding-right:16px;margin-left:-16px;margin-right:-16px}.service-detail-info h3{font-size:18px}.service-detail-info p{font-size:14px}.service-detail-link{width:44px;height:44px}.cta-buttons{flex-direction:column;width:100%}.cta-buttons .cta-btn{width:100%;max-width:300px}}@media (max-width:420px){.services-hero, .service-detail-hero{padding:120px 16px 40px}.services-main, .services-process, .services-tech, .services-cta, .services-all, .service-detail-stats, .service-detail-content, .other-services, .service-detail-cta{padding-left:16px;padding-right:16px}.service-category{padding:20px}.service-category h3{font-size:16px}.service-category li{font-size:13px;padding:8px 0}.service-card-large{padding:24px}.service-card-number{font-size:36px}.service-detail-item{flex-wrap:wrap;gap:16px;padding:20px 0}.service-detail-num{font-size:13px}.service-detail-info{width:calc(100% - 50px)}.service-detail-info h3{font-size:16px}.service-detail-link{width:40px;height:40px}.service-detail-link svg{width:18px;height:18px}}/* ==================== PORTFOLIO PAGE ==================== */ .portfolio-hero{min-height:60vh;display:flex;align-items:center;padding:160px 48px 80px}.portfolio-hero-content{max-width:800px}.portfolio-hero-desc{font-size:20px;color:var(--gray);line-height:1.7;margin-top:24px}.portfolio-stats{padding:0 48px 80px}/* Portfolio Filter */ .portfolio-main{padding:0 48px 100px}.portfolio-filter{display:flex;gap:12px;margin-bottom:48px;flex-wrap:wrap}.filter-btn{padding:12px 24px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:30px;color:var(--gray);font-size:14px;font-weight:500;cursor:pointer;transition:all 0.3s ease}.filter-btn:hover{background:rgba(255, 255, 255, 0.06);color:#fff}.filter-btn.active{background:linear-gradient(135deg, #6366f1, #8b5cf6);border-color:transparent;color:#fff}/* Portfolio Grid */ .portfolio-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:32px}.portfolio-card{background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:24px;overflow:hidden;transition:all 0.4s ease}.portfolio-card:hover{transform:translateY(-8px);border-color:rgba(99, 102, 241, 0.2)}.portfolio-card-image{position:relative;aspect-ratio:16/10;overflow:hidden}.portfolio-card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}.portfolio-card:hover .portfolio-card-image img{transform:scale(1.1)}.portfolio-card-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,0.8), transparent);display:flex;align-items:flex-end;justify-content:space-between;padding:24px;opacity:0;transition:opacity 0.3s ease}.portfolio-card:hover .portfolio-card-overlay{opacity:1}.portfolio-category{padding:8px 16px;background:rgba(255, 255, 255, 0.1);backdrop-filter:blur(10px);border-radius:20px;font-size:12px;font-weight:500;color:#fff}.portfolio-link{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:50%;color:#fff;transition:transform 0.3s ease}.portfolio-link:hover{transform:scale(1.1)}.portfolio-link svg{width:20px;height:20px}.portfolio-card-content{padding:28px}.portfolio-card-content h3{font-size:20px;font-weight:600;margin-bottom:12px}.portfolio-card-content p{font-size:14px;color:var(--gray);line-height:1.6;margin-bottom:20px}.portfolio-tags{display:flex;flex-wrap:wrap;gap:8px}.portfolio-tags .tag{padding:6px 12px;background:rgba(99, 102, 241, 0.1);border-radius:6px;font-size:12px;color:#6366f1}/* Portfolio CTA */ .portfolio-cta{padding:100px 48px;text-align:center;background:rgba(255, 255, 255, 0.01)}/* Portfolio Responsive */ @media (max-width:1024px){.portfolio-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:768px){.portfolio-hero{padding:140px 24px 60px;min-height:auto}.portfolio-stats, .portfolio-main, .portfolio-cta{padding-left:24px;padding-right:24px}.portfolio-grid{grid-template-columns:1fr;gap:24px}.filter-btn{padding:10px 18px;font-size:13px}}@media (max-width:420px){.portfolio-hero{padding:120px 16px 40px}.portfolio-stats, .portfolio-main, .portfolio-cta{padding-left:16px;padding-right:16px}.portfolio-card-content{padding:20px}.portfolio-card-content h3{font-size:18px}}/* ==================== LEGAL PAGES ==================== */ .legal-hero{min-height:40vh;display:flex;align-items:center;padding:160px 48px 60px}.legal-hero-content{max-width:700px}.legal-hero-desc{font-size:16px;color:var(--gray);margin-top:16px}/* Legal Content */ .legal-content{padding:60px 48px 100px}.legal-container{display:grid;grid-template-columns:250px 1fr;gap:60px;max-width:1200px}/* Legal Navigation */ .legal-nav{position:sticky;top:100px;align-self:start}.legal-nav h4{font-size:14px;font-weight:600;color:var(--gray);margin-bottom:20px;text-transform:uppercase;letter-spacing:1px}.legal-nav a{display:block;padding:10px 0;font-size:14px;color:var(--gray);text-decoration:none;border-left:2px solid rgba(255, 255, 255, 0.05);padding-left:16px;margin-left:-2px;transition:all 0.2s ease}.legal-nav a:hover{color:#fff;border-color:#6366f1}/* Legal Text */ .legal-text{max-width:800px}.legal-text section{margin-bottom:48px;scroll-margin-top:100px}.legal-text h2{font-size:24px;font-weight:600;margin-bottom:20px;color:#fff}.legal-text h3{font-size:18px;font-weight:600;margin:24px 0 12px;color:#fff}.legal-text p{font-size:15px;color:var(--gray);line-height:1.8;margin-bottom:16px}.legal-text ul{margin:16px 0;padding-left:24px}.legal-text li{font-size:15px;color:var(--gray);line-height:1.8;margin-bottom:8px}.legal-text a{color:#6366f1;text-decoration:none;transition:color 0.2s ease}.legal-text a:hover{color:#8b5cf6}/* Legal Contact Box */ .legal-contact{padding:24px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:16px;margin:20px 0}.legal-contact p{margin-bottom:8px}.legal-contact p:last-child{margin-bottom:0}/* Legal Table */ .legal-table{overflow-x:auto;margin:24px 0}.legal-table table{width:100%;border-collapse:collapse}.legal-table th, .legal-table td{padding:16px;text-align:left;border-bottom:1px solid rgba(255, 255, 255, 0.05);font-size:14px}.legal-table th{background:rgba(255, 255, 255, 0.02);color:#fff;font-weight:600}.legal-table td{color:var(--gray)}/* Legal Methods */ .legal-methods{display:grid;grid-template-columns:repeat(2, 1fr);gap:20px;margin:24px 0}.method-card{padding:24px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:16px}.method-card h4{font-size:16px;font-weight:600;margin-bottom:12px;color:#6366f1}.method-card p{margin-bottom:0}/* Cookie Services */ .cookie-services{display:grid;grid-template-columns:repeat(2, 1fr);gap:16px;margin:24px 0}.cookie-service{padding:20px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:12px}.cookie-service h4{font-size:15px;font-weight:600;margin-bottom:8px}.cookie-service p{font-size:13px;margin-bottom:12px}.cookie-service a{font-size:13px}/* Browser Links */ .browser-links{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.browser-links a{padding:10px 20px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:8px;font-size:14px;transition:all 0.2s ease}.browser-links a:hover{background:rgba(255, 255, 255, 0.06);border-color:rgba(99, 102, 241, 0.3)}/* Legal Links Section */ .legal-links{padding:60px 48px 100px;background:rgba(255, 255, 255, 0.01)}.legal-links-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:24px;max-width:800px}.legal-link-card{display:block;padding:32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;text-decoration:none;transition:all 0.3s ease;position:relative}.legal-link-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2);transform:translateY(-4px)}.legal-link-card h4{font-size:18px;font-weight:600;margin-bottom:8px;color:#fff}.legal-link-card p{font-size:14px;color:var(--gray);line-height:1.6}.legal-link-card svg{position:absolute;top:32px;right:32px;width:24px;height:24px;stroke:var(--gray);transition:all 0.3s ease}.legal-link-card:hover svg{stroke:#6366f1;transform:translate(4px, -4px)}/* Legal Pages Responsive */ @media (max-width:1024px){.legal-container{grid-template-columns:1fr;gap:40px}.legal-nav{position:relative;top:0;display:flex;flex-wrap:wrap;gap:8px;padding-bottom:24px;border-bottom:1px solid rgba(255, 255, 255, 0.05)}.legal-nav h4{width:100%;margin-bottom:12px}.legal-nav a{border-left:none;padding:8px 16px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;margin-left:0}.legal-nav a:hover{background:rgba(99, 102, 241, 0.1);border-color:rgba(99, 102, 241, 0.2)}.legal-methods, .cookie-services{grid-template-columns:1fr}}@media (max-width:768px){.legal-hero{padding:140px 24px 40px;min-height:auto}.legal-content, .legal-links{padding-left:24px;padding-right:24px}.legal-text h2{font-size:20px}.legal-links-grid{grid-template-columns:1fr}}@media (max-width:420px){.legal-hero{padding:120px 16px 32px}.legal-content, .legal-links{padding-left:16px;padding-right:16px}.legal-nav a{padding:6px 12px;font-size:13px}.legal-text h2{font-size:18px}.legal-table th, .legal-table td{padding:12px;font-size:13px}.method-card, .cookie-service{padding:16px}.legal-link-card{padding:24px}.legal-link-card svg{top:24px;right:24px}}/* ==================== BLOG PAGE ==================== */ .blog-hero{min-height:50vh;display:flex;align-items:center;padding:160px 48px 60px}.blog-hero-content{max-width:700px}.blog-hero-desc{font-size:18px;color:var(--gray);line-height:1.7;margin-top:20px}/* Featured Posts */ .blog-featured{padding:0 48px 80px}.featured-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:32px}.featured-card{display:block;position:relative;border-radius:24px;overflow:hidden;text-decoration:none;color:inherit;min-height:450px}.featured-image{position:absolute;inset:0}.featured-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}.featured-card:hover .featured-image img{transform:scale(1.05)}.featured-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.1) 100%)}.featured-content{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding:40px;z-index:1}.featured-meta{display:flex;align-items:center;gap:16px;margin-bottom:16px}.featured-category{padding:6px 14px;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:20px;font-size:12px;font-weight:500}.featured-date{font-size:13px;color:var(--gray)}.featured-content h2{font-size:28px;font-weight:600;margin-bottom:12px;line-height:1.3}.featured-content p{font-size:15px;color:var(--gray);line-height:1.6;margin-bottom:20px}.featured-footer{display:flex;align-items:center;justify-content:space-between}.read-time{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--gray)}.read-time svg{width:16px;height:16px}.read-more{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#6366f1;transition:gap 0.3s ease}.read-more svg{width:18px;height:18px}.featured-card:hover .read-more{gap:12px}/* Blog Posts Grid */ .blog-posts{padding:60px 48px 100px;background:rgba(255, 255, 255, 0.01)}.posts-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:32px;margin-top:48px}.post-card{display:block;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px;overflow:hidden;text-decoration:none;color:inherit;transition:all 0.3s ease}.post-card:hover{transform:translateY(-8px);border-color:rgba(99, 102, 241, 0.2)}.post-image{position:relative;aspect-ratio:16/10;overflow:hidden}.post-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}.post-card:hover .post-image img{transform:scale(1.05)}.post-category{position:absolute;top:16px;left:16px;padding:6px 12px;background:rgba(0, 0, 0, 0.6);backdrop-filter:blur(10px);border-radius:20px;font-size:11px;font-weight:500}.post-content{padding:24px}.post-meta{display:flex;align-items:center;gap:16px;margin-bottom:12px;font-size:13px;color:var(--gray)}.post-content h3{font-size:18px;font-weight:600;margin-bottom:10px;line-height:1.4;transition:color 0.3s ease}.post-card:hover .post-content h3{color:#6366f1}.post-content p{font-size:14px;color:var(--gray);line-height:1.6}/* Newsletter */ .blog-newsletter{padding:100px 48px}.newsletter-content{max-width:600px;margin:0 auto;text-align:center}.newsletter-icon{width:80px;height:80px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-radius:24px}.newsletter-icon svg{width:40px;height:40px;stroke:#6366f1}.newsletter-content h2{font-size:32px;font-weight:600;margin-bottom:12px}.newsletter-content p{font-size:16px;color:var(--gray);margin-bottom:32px}.newsletter-form{display:flex;gap:12px;max-width:450px;margin:0 auto}.newsletter-form input{flex:1;padding:16px 20px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:12px;color:#fff;font-size:15px;outline:none;transition:border-color 0.3s ease}.newsletter-form input:focus{border-color:rgba(99, 102, 241, 0.5)}.newsletter-form input::placeholder{color:var(--gray)}.newsletter-form button{display:flex;align-items:center;gap:8px;padding:16px 24px;background:linear-gradient(135deg, #6366f1, #8b5cf6);border:none;border-radius:12px;color:#fff;font-size:15px;font-weight:500;cursor:pointer;transition:all 0.3s ease}.newsletter-form button:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(99, 102, 241, 0.3)}.newsletter-form button svg{width:18px;height:18px}/* ==================== BLOG DETAIL PAGE ==================== */ .blog-detail-hero{padding:160px 48px 60px}.blog-detail-hero-content{max-width:800px}.blog-detail-meta{display:flex;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}.blog-category{padding:6px 14px;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:20px;font-size:12px;font-weight:500}.blog-date, .blog-read-time{font-size:14px;color:var(--gray)}.blog-detail-hero h1{font-size:48px;font-weight:700;line-height:1.2;margin-bottom:20px}.blog-excerpt{font-size:20px;color:var(--gray);line-height:1.7;margin-bottom:32px}.blog-author{display:flex;align-items:center;gap:16px}.author-avatar{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:50%;font-weight:600;font-size:18px}.author-info{display:flex;flex-direction:column;gap:2px}.author-name{font-weight:600;font-size:15px}.author-role{font-size:13px;color:var(--gray)}/* Blog Detail Image */ .blog-detail-image{padding:0 48px 60px}.blog-detail-image img{width:100%;max-width:1000px;height:auto;border-radius:24px;object-fit:cover}/* Blog Content */ .blog-detail-content{padding:0 48px 80px}.blog-layout{display:grid;grid-template-columns:1fr 340px;gap:60px;max-width:1200px}.blog-main{max-width:100%}.blog-container{max-width:800px}/* Blog Sidebar */ .blog-sidebar{display:flex;flex-direction:column;gap:24px;position:sticky;top:100px;align-self:start;height:fit-content}.sidebar-card{padding:28px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:20px}.sidebar-card h4{font-size:16px;font-weight:600;margin-bottom:20px}/* Author Card */ .author-card{text-align:center}.sidebar-author-avatar{width:72px;height:72px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:50%;font-size:28px;font-weight:600}.author-card p{font-size:14px;color:var(--gray);line-height:1.6;margin-bottom:16px}.sidebar-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#6366f1;text-decoration:none;font-weight:500;transition:gap 0.3s ease}.sidebar-link:hover{gap:10px}/* Sidebar Posts */ .sidebar-posts{display:flex;flex-direction:column;gap:16px}.sidebar-post{display:flex;gap:14px;text-decoration:none;color:inherit;transition:opacity 0.3s ease}.sidebar-post:hover{opacity:0.8}.sidebar-post img{width:80px;height:60px;object-fit:cover;border-radius:10px;flex-shrink:0}.sidebar-post-content{display:flex;flex-direction:column;justify-content:center}.sidebar-post-content span{font-size:11px;color:#6366f1;margin-bottom:4px}.sidebar-post-content h5{font-size:14px;font-weight:500;line-height:1.4}/* Sidebar Categories */ .sidebar-categories{display:flex;flex-wrap:wrap;gap:8px}.sidebar-categories a{padding:8px 14px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:20px;font-size:13px;color:var(--gray);text-decoration:none;transition:all 0.2s ease}.sidebar-categories a:hover{background:rgba(99, 102, 241, 0.1);border-color:rgba(99, 102, 241, 0.3);color:#fff}/* Sidebar CTA */ .sidebar-cta{text-align:center;background:linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));border-color:rgba(99, 102, 241, 0.2)}.sidebar-cta-icon{width:56px;height:56px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;background:rgba(99, 102, 241, 0.15);border-radius:16px}.sidebar-cta-icon svg{width:28px;height:28px;stroke:#6366f1}.sidebar-cta p{font-size:14px;color:var(--gray);margin-bottom:20px}.sidebar-cta-btn{display:inline-flex;padding:12px 24px;background:linear-gradient(135deg, #6366f1, #8b5cf6);border-radius:10px;font-size:14px;font-weight:500;color:#fff;text-decoration:none;transition:all 0.3s ease}.sidebar-cta-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(99, 102, 241, 0.3)}.blog-article{font-size:17px;line-height:1.9;color:rgba(255, 255, 255, 0.85)}.blog-article h2{font-size:28px;font-weight:600;margin:48px 0 20px;color:#fff}.blog-article h3{font-size:22px;font-weight:600;margin:36px 0 16px;color:#fff}.blog-article p{margin-bottom:24px}.blog-article ul, .blog-article ol{margin:24px 0;padding-left:24px}.blog-article li{margin-bottom:12px}.blog-article blockquote{margin:32px 0;padding:24px 32px;background:rgba(99, 102, 241, 0.1);border-left:4px solid #6366f1;border-radius:0 16px 16px 0;font-style:italic;font-size:18px;color:rgba(255, 255, 255, 0.9)}.blog-article a{color:#6366f1;text-decoration:none;transition:color 0.2s ease}.blog-article a:hover{color:#8b5cf6}.blog-article strong{color:#fff;font-weight:600}/* Blog Share */ .blog-share{display:flex;align-items:center;gap:16px;padding:32px 0;border-top:1px solid rgba(255, 255, 255, 0.05);border-bottom:1px solid rgba(255, 255, 255, 0.05);margin:48px 0 24px}.blog-share > span{font-size:14px;color:var(--gray)}.share-buttons{display:flex;gap:12px}.share-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:12px;color:var(--gray);transition:all 0.3s ease}.share-btn:hover{background:rgba(255, 255, 255, 0.08);color:#fff}.share-btn svg{width:18px;height:18px}.share-btn.twitter:hover{color:#1DA1F2}.share-btn.linkedin:hover{color:#0A66C2}.share-btn.facebook:hover{color:#1877F2}/* Blog Tags */ .blog-tags{display:flex;flex-wrap:wrap;gap:10px}.blog-tags .tag{padding:8px 16px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:20px;font-size:13px;color:var(--gray);transition:all 0.2s ease}.blog-tags .tag:hover{background:rgba(99, 102, 241, 0.1);border-color:rgba(99, 102, 241, 0.2);color:#fff}/* Related Posts */ .blog-related{padding:80px 48px;background:rgba(255, 255, 255, 0.01)}.related-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:32px;margin-top:48px;max-width:900px}.related-card{display:flex;gap:20px;padding:20px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.05);border-radius:16px;text-decoration:none;color:inherit;transition:all 0.3s ease}.related-card:hover{background:rgba(255, 255, 255, 0.04);border-color:rgba(99, 102, 241, 0.2)}.related-image{width:120px;height:90px;border-radius:12px;overflow:hidden;flex-shrink:0}.related-image img{width:100%;height:100%;object-fit:cover}.related-content{display:flex;flex-direction:column;justify-content:center}.related-category{font-size:12px;color:#6366f1;margin-bottom:8px}.related-content h3{font-size:16px;font-weight:600;margin-bottom:8px;line-height:1.4}.related-date{font-size:13px;color:var(--gray)}/* Blog CTA */ .blog-cta{padding:100px 48px;text-align:center}/* Blog Responsive */ @media (max-width:1024px){.featured-grid{grid-template-columns:1fr}.posts-grid{grid-template-columns:repeat(2, 1fr)}.blog-layout{grid-template-columns:1fr;gap:48px}.blog-sidebar{display:grid;grid-template-columns:repeat(2, 1fr);gap:24px;position:relative;top:0}.blog-detail-hero h1{font-size:36px}.related-grid{grid-template-columns:1fr}}@media (max-width:768px){.blog-hero, .blog-detail-hero{padding:140px 24px 40px}.blog-featured, .blog-posts, .blog-newsletter, .blog-detail-image, .blog-detail-content, .blog-related, .blog-cta{padding-left:24px;padding-right:24px}.featured-card{min-height:380px}.featured-content{padding:28px}.featured-content h2{font-size:22px}.posts-grid{grid-template-columns:1fr;gap:24px}.newsletter-form{flex-direction:column}.blog-detail-hero h1{font-size:28px}.blog-excerpt{font-size:17px}.blog-article{font-size:16px}.blog-article h2{font-size:22px}.blog-article blockquote{padding:20px 24px;font-size:16px}.related-card{flex-direction:column}.related-image{width:100%;height:160px}.blog-sidebar{grid-template-columns:1fr}}@media (max-width:420px){.blog-hero, .blog-detail-hero{padding:120px 16px 32px}.blog-featured, .blog-posts, .blog-newsletter, .blog-detail-image, .blog-detail-content, .blog-related, .blog-cta{padding-left:16px;padding-right:16px}.featured-card{min-height:340px}.featured-content{padding:20px}.featured-content h2{font-size:20px}.featured-meta{gap:10px}.post-content{padding:20px}.post-content h3{font-size:16px}.newsletter-content h2{font-size:24px}.blog-detail-hero h1{font-size:24px}.blog-excerpt{font-size:16px}.blog-article h2{font-size:20px;margin:36px 0 16px}.blog-share{flex-direction:column;align-items:flex-start;gap:12px}}/* ============================================== PROJECT DETAIL PAGE STYLES ============================================== */ /* Project Hero */ .project-hero{padding:160px 60px 60px;max-width:1400px;margin:0 auto}.project-hero-content{max-width:900px}.project-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:24px;font-size:14px;color:var(--gray)}.project-breadcrumb a{color:var(--gray);text-decoration:none;transition:color 0.3s ease}.project-breadcrumb a:hover{color:var(--accent)}.project-breadcrumb svg{opacity:0.5}.project-breadcrumb span:last-child{color:var(--text)}.project-category-badge{display:inline-block;padding:8px 16px;border-radius:20px;font-size:13px;font-weight:500;background:rgba(99, 102, 241, 0.2);color:var(--accent);margin-bottom:20px}.project-title{font-size:clamp(36px, 6vw, 64px);font-weight:700;line-height:1.1;margin-bottom:24px;background:linear-gradient(135deg, var(--text), var(--gray));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.project-description{font-size:18px;color:var(--gray);line-height:1.7;margin-bottom:40px;max-width:700px}.project-meta{display:flex;flex-wrap:wrap;gap:40px}.meta-item{display:flex;flex-direction:column;gap:4px}.meta-label{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--gray)}.meta-value{font-size:16px;font-weight:500;color:var(--text)}.meta-link{font-size:16px;font-weight:500;color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:gap 0.3s ease}.meta-link:hover{gap:10px}/* Project Image */ .project-image-section{padding:0 60px 60px;max-width:1400px;margin:0 auto}.project-main-image{width:100%;border-radius:24px;overflow:hidden;aspect-ratio:16/9;background:rgba(255, 255, 255, 0.05)}.project-main-image img{width:100%;height:100%;object-fit:cover}/* Project Content Grid */ .project-content-section{padding:60px 60px 100px;max-width:1400px;margin:0 auto}.project-content-grid{display:grid;grid-template-columns:300px 1fr;gap:60px}/* Sidebar */ .project-sidebar{position:sticky;top:120px;height:fit-content}.sidebar-block{margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid rgba(255, 255, 255, 0.1)}.sidebar-block:last-of-type{border-bottom:none}.sidebar-block h3{font-size:14px;text-transform:uppercase;letter-spacing:1px;color:var(--gray);margin-bottom:16px}.tech-tags{display:flex;flex-wrap:wrap;gap:8px}.tech-tag{padding:8px 14px;background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);border-radius:8px;font-size:13px;color:var(--text);transition:all 0.3s ease}.tech-tag:hover{background:rgba(99, 102, 241, 0.1);border-color:var(--accent);color:var(--accent)}.project-info-list{list-style:none;display:flex;flex-direction:column;gap:16px}.project-info-list li{display:flex;align-items:center;gap:12px;color:var(--text);font-size:14px}.project-info-list svg{color:var(--accent);flex-shrink:0}.sidebar-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px 24px;background:linear-gradient(135deg, var(--accent), var(--accent-2));border-radius:12px;color:white;text-decoration:none;font-weight:600;transition:all 0.3s ease}.sidebar-cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(99, 102, 241, 0.3)}/* Main Content */ .project-main-content{min-width:0}.content-body{font-size:17px;line-height:1.8;color:rgba(255, 255, 255, 0.85)}.content-body h2{font-size:28px;margin:48px 0 20px;color:var(--text)}.content-body h3{font-size:22px;margin:36px 0 16px;color:var(--text)}.content-body p{margin-bottom:20px}.content-body ul, .content-body ol{margin:20px 0;padding-left:24px}.content-body li{margin-bottom:10px}.content-body img{max-width:100%;border-radius:12px;margin:24px 0}.content-body blockquote{border-left:4px solid var(--accent);padding-left:24px;margin:24px 0;font-style:italic;color:var(--gray)}.content-body code{background:rgba(255, 255, 255, 0.1);padding:2px 8px;border-radius:4px;font-family:monospace;font-size:14px}.content-body pre{background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);border-radius:12px;padding:20px;overflow-x:auto;margin:24px 0}.content-body pre code{background:none;padding:0}/* Project Gallery */ .project-gallery{margin-top:60px}.project-gallery h3{font-size:24px;margin-bottom:24px;color:var(--text)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(250px, 1fr));gap:16px}.gallery-item{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/3;cursor:pointer}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}.gallery-overlay{position:absolute;inset:0;background:rgba(0, 0, 0, 0.5);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s ease}.gallery-overlay svg{color:white}.gallery-item:hover img{transform:scale(1.1)}.gallery-item:hover .gallery-overlay{opacity:1}/* Related Projects */ .related-projects{padding:80px 60px;max-width:1400px;margin:0 auto;border-top:1px solid rgba(255, 255, 255, 0.1)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:40px}.section-header h2{font-size:32px}.view-all{display:inline-flex;align-items:center;gap:8px;color:var(--accent);text-decoration:none;font-weight:500;transition:gap 0.3s ease}.view-all:hover{gap:12px}.related-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px}/* Lightbox */ .lightbox{position:fixed;inset:0;background:rgba(0, 0, 0, 0.95);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity 0.3s ease}.lightbox.active{opacity:1;pointer-events:auto}.lightbox-close, .lightbox-prev, .lightbox-next{position:absolute;background:rgba(255, 255, 255, 0.1);border:none;color:white;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;z-index:10}.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{background:rgba(255, 255, 255, 0.2)}.lightbox-close{top:20px;right:20px}.lightbox-prev{left:20px;top:50%;transform:translateY(-50%)}.lightbox-next{right:20px;top:50%;transform:translateY(-50%)}.lightbox-content{max-width:90%;max-height:90vh}.lightbox-content img{max-width:100%;max-height:90vh;object-fit:contain;border-radius:8px}/* Error Section */ .error-section{min-height:60vh;display:flex;align-items:center;justify-content:center;padding:60px;text-align:center}.error-content h1{font-size:120px;background:linear-gradient(135deg, var(--accent), var(--accent-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:20px}.error-content p{color:var(--gray);font-size:18px;margin-bottom:30px}.btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:white;text-decoration:none;border-radius:12px;font-weight:600;transition:all 0.3s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(99, 102, 241, 0.3)}/* Project Detail Responsive */ @media (max-width:1024px){.project-hero{padding:140px 40px 40px}.project-image-section, .project-content-section, .related-projects{padding-left:40px;padding-right:40px}.project-content-grid{grid-template-columns:1fr;gap:40px}.project-sidebar{position:static;display:grid;grid-template-columns:repeat(2, 1fr);gap:24px}.sidebar-block{margin-bottom:0;padding-bottom:0;border-bottom:none}.sidebar-cta{grid-column:span 2}.related-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:768px){.project-hero{padding:120px 20px 30px}.project-breadcrumb{font-size:12px;flex-wrap:wrap}.project-title{font-size:32px}.project-description{font-size:16px}.project-meta{gap:24px}.project-image-section, .project-content-section, .related-projects{padding-left:20px;padding-right:20px}.project-main-image{border-radius:16px}.project-sidebar{grid-template-columns:1fr}.sidebar-cta{grid-column:span 1}.content-body{font-size:16px}.content-body h2{font-size:24px}.gallery-grid{grid-template-columns:repeat(2, 1fr)}.section-header{flex-direction:column;gap:16px;align-items:flex-start}.section-header h2{font-size:24px}.related-grid{grid-template-columns:1fr}.lightbox-prev, .lightbox-next{width:40px;height:40px}.error-content h1{font-size:80px}}/* ============================================== SERVICE DETAIL PAGE STYLES ============================================== */ .service-detail-hero{padding:160px 60px 80px;max-width:1000px;margin:0 auto;text-align:center}.service-detail-hero-content{max-width:800px;margin:0 auto}.service-breadcrumb{display:inline-flex;align-items:center;gap:8px;margin-bottom:32px;font-size:14px;color:var(--gray)}.service-breadcrumb a{color:var(--gray);text-decoration:none;transition:color 0.3s ease}.service-breadcrumb a:hover{color:var(--accent)}.service-detail-icon{width:80px;height:80px;margin:0 auto 24px;background:linear-gradient(135deg, var(--accent), var(--accent-2));border-radius:20px;display:flex;align-items:center;justify-content:center}.service-detail-icon svg{width:40px;height:40px;color:white}.service-detail-title{font-size:clamp(36px, 5vw, 56px);font-weight:700;line-height:1.1;margin-bottom:20px}.service-detail-desc{font-size:18px;color:var(--gray);line-height:1.7;margin-bottom:32px}.service-cta-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:white;text-decoration:none;border-radius:12px;font-weight:600;font-size:16px;transition:all 0.3s ease}.service-cta-btn:hover{transform:translateY(-3px);box-shadow:0 15px 40px rgba(99, 102, 241, 0.4)}.service-image-section{padding:0 60px 60px;max-width:1200px;margin:0 auto}.service-main-image{width:100%;border-radius:24px;overflow:hidden;aspect-ratio:16/9;background:rgba(255, 255, 255, 0.05)}.service-main-image img{width:100%;height:100%;object-fit:cover}.service-content-section{padding:60px 60px 100px;max-width:1200px;margin:0 auto}.service-content-grid{display:grid;grid-template-columns:1fr 350px;gap:60px}.service-main-content{min-width:0}.service-features-grid{margin-top:48px;padding:32px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:20px}.service-features-grid h3{font-size:22px;margin-bottom:24px}.features-list{display:grid;grid-template-columns:repeat(2, 1fr);gap:16px}.feature-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(255, 255, 255, 0.03);border-radius:10px;transition:all 0.3s ease}.feature-item:hover{background:rgba(99, 102, 241, 0.1)}.feature-icon{width:24px;height:24px;flex-shrink:0;color:var(--accent)}.feature-icon svg{width:100%;height:100%}.service-sidebar{display:flex;flex-direction:column;gap:24px;position:sticky;top:120px;height:fit-content}.sidebar-card{padding:28px;background:rgba(255, 255, 255, 0.03);border:1px solid rgba(255, 255, 255, 0.08);border-radius:16px}.sidebar-card h3{font-size:18px;margin-bottom:12px}.sidebar-card > p{color:var(--gray);font-size:14px;margin-bottom:20px}.why-us-list{list-style:none;display:flex;flex-direction:column;gap:14px}.why-us-list li{display:flex;align-items:center;gap:10px;font-size:14px;color:rgba(255, 255, 255, 0.85)}.why-us-list svg{color:var(--accent);flex-shrink:0}.other-services{padding:80px 60px;max-width:1200px;margin:0 auto;border-top:1px solid rgba(255, 255, 255, 0.1)}.other-services-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px}.other-service-card{padding:32px;background:rgba(255, 255, 255, 0.02);border:1px solid rgba(255, 255, 255, 0.08);border-radius:16px;text-decoration:none;color:var(--text);transition:all 0.3s ease}.other-service-card:hover{background:rgba(255, 255, 255, 0.05);border-color:var(--accent);transform:translateY(-5px)}.other-service-icon{width:50px;height:50px;background:linear-gradient(135deg, var(--accent), var(--accent-2));border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:20px}.other-service-icon svg{width:26px;height:26px;color:white}.other-service-card h3{font-size:20px;margin-bottom:10px}.other-service-card p{font-size:14px;color:var(--gray);line-height:1.6;margin-bottom:16px}.other-service-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--accent);transition:gap 0.3s ease}.other-service-card:hover .other-service-link{gap:10px}/* Service Detail Responsive */ @media (max-width:1024px){.service-detail-hero{padding:140px 40px 60px}.service-image-section, .service-content-section, .other-services{padding-left:40px;padding-right:40px}.service-content-grid{grid-template-columns:1fr;gap:40px}.service-sidebar{position:static;flex-direction:row}.sidebar-card{flex:1}.features-list{grid-template-columns:1fr}.other-services-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:768px){.service-detail-hero{padding:120px 20px 40px}.service-breadcrumb{flex-wrap:wrap;justify-content:center}.service-detail-icon{width:60px;height:60px}.service-detail-icon svg{width:30px;height:30px}.service-detail-title{font-size:32px}.service-image-section, .service-content-section, .other-services{padding-left:20px;padding-right:20px}.service-sidebar{flex-direction:column}.other-services-grid{grid-template-columns:1fr}}