*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#000;color:#fff;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}
img,video,svg{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit}
:focus-visible{outline:2px solid #00ffaa;outline-offset:2px}

:root{
--primary:#00ffaa;--secondary:#0077ff;--accent:#ff8800;
--bg:#000;--bg-alt:#0a0a0a;--card:#111;--text:#fff;--muted:#9ca3af;--border:rgba(255,255,255,0.1);
--font-xs:clamp(0.75rem,2vw,0.875rem);--font-sm:clamp(0.875rem,2.5vw,1rem);--font-base:clamp(1rem,3vw,1.125rem);
--font-lg:clamp(1.125rem,3.5vw,1.25rem);--font-xl:clamp(1.25rem,4vw,1.5rem);--font-2xl:clamp(1.5rem,5vw,2rem);
--font-3xl:clamp(1.75rem,6vw,3rem);--font-4xl:clamp(2rem,7vw,3.5rem);--font-5xl:clamp(2.5rem,9vw,4.5rem);
--space-xs:clamp(0.25rem,1vw,0.5rem);--space-sm:clamp(0.5rem,2vw,1rem);--space-md:clamp(1rem,3vw,1.5rem);
--space-lg:clamp(1.5rem,4vw,2rem);--space-xl:clamp(2rem,5vw,3rem);--space-2xl:clamp(3rem,6vw,4rem);--space-3xl:clamp(4rem,8vw,6rem);
--radius-sm:0.5rem;--radius-md:1rem;--radius-lg:1.5rem;--radius-full:9999px;
--shadow-glow:0 0 30px rgba(0,255,170,0.3);
--transition:.3s ease;--container:1200px;
--header-h:120px;
}
@media(max-width:480px){:root{--header-h:80px}}

.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 clamp(1rem,5vw,2rem)}
.section{padding:var(--space-3xl) 0}
.section-alt{background:var(--bg-alt)}

#vortex-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;opacity:.7;pointer-events:none}
.content-wrapper{position:relative;z-index:1}

/* NAV */
.nav{position:fixed;top:0;padding-top:env(safe-area-inset-top);left:0;right:0;z-index:100;padding:0;height:var(--header-h);display:flex;align-items:center;transition:var(--transition)}
.nav.scrolled{background:rgba(0,0,0,0.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 4px 20px rgba(0,255,170,0.1)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);width:100%;height:100%}
.nav-logo{display:flex;align-items:center;height:100%;padding:5px 0}
.nav-logo img{height:60px;width:auto;object-fit:contain;transition:var(--transition)}
@media(min-width:480px){.nav-logo img{height:90px}}
.nav-logo:hover img{filter:drop-shadow(0 0 8px rgba(0,255,170,0.5));transform:scale(1.05)}
.nav-links{display:none;list-style:none;gap:var(--space-lg)}
@media(min-width:900px){.nav-links{display:flex}}
.nav-links a{color:var(--muted);font-size:var(--font-sm);font-weight:500;transition:var(--transition);white-space:nowrap}
.nav-links a:hover{color:var(--text)}
.nav-cta{background:var(--primary);color:#000;font-weight:700;padding:.5rem 1rem;border-radius:var(--radius-full);border:none;cursor:pointer;transition:var(--transition);font-size:var(--font-xs);white-space:nowrap}
@media(min-width:480px){.nav-cta{padding:.75rem 1.5rem;font-size:var(--font-sm)}}
.nav-cta:hover{background:#fff;transform:scale(1.05)}
.nav-mobile-toggle{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:5px;margin-left:var(--space-xs)}
@media(min-width:900px){.nav-mobile-toggle{display:none}}
.nav-mobile-toggle span{width:22px;height:2px;background:var(--text);transition:var(--transition);transform-origin:center}
.nav-mobile-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-mobile-toggle.active span:nth-child(2){opacity:0}
.nav-mobile-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}
.nav-mobile{position:fixed;inset:0;background:rgba(0,0,0,0.98);z-index:99;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-lg);opacity:0;visibility:hidden;transition:var(--transition)}
.nav-mobile.open{opacity:1;visibility:visible}
.nav-mobile a{font-size:var(--font-2xl);font-weight:600;color:var(--text)}
.nav-mobile-close{display:none}
.nav-account{display:flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 10px;border-radius:var(--radius-full);border:2px solid rgba(255,255,255,0.15);background:transparent;cursor:pointer;transition:var(--transition);flex-shrink:0;color:var(--muted);white-space:nowrap;text-decoration:none}
.nav-account:hover{border-color:var(--primary);color:var(--primary);box-shadow:0 0 12px rgba(0,255,170,0.25);transform:scale(1.05)}
.nav-account svg{width:18px;height:18px;flex-shrink:0}
.nav-account-label{display:none;font-size:var(--font-xs);font-weight:600}
@media(min-width:900px){.nav-account{padding:0 14px}.nav-account-label{display:inline}}
@media(max-width:480px){.nav-account{width:36px;height:36px;padding:0;border-radius:50%}.nav-account svg{width:16px;height:16px}}

/* HERO */
.hero{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(var(--header-h) + env(safe-area-inset-top, 0px) + var(--space-xl)) clamp(1rem,5vw,2rem) var(--space-xl);position:relative}
.hero-content{max-width:800px;width:100%}
.hero-badge{display:inline-flex;align-items:center;gap:var(--space-xs);padding:.4rem .8rem;background:rgba(0,255,170,0.1);border:1px solid rgba(0,255,170,0.2);border-radius:var(--radius-full);margin-bottom:var(--space-md);animation:fadeInUp 1s ease forwards}
@media(min-width:480px){.hero-badge{padding:.5rem 1rem;margin-bottom:var(--space-lg)}}
.hero-badge-dot{width:6px;height:6px;background:var(--primary);border-radius:50%;animation:pulse 2s infinite}
@media(min-width:480px){.hero-badge-dot{width:8px;height:8px}}
.hero-badge-text{color:var(--primary);font-size:var(--font-xs);font-weight:500}
@media(min-width:480px){.hero-badge-text{font-size:var(--font-sm)}}
.hero-title{font-size:var(--font-5xl);font-weight:800;line-height:1.1;margin-bottom:var(--space-md);animation:fadeInUp 1s ease .2s forwards;opacity:0}
.hero-title-typed{display:block;color:var(--primary);min-height:1.2em}
.hero-title-typed::after{content:'_';animation:blink .7s infinite}
.hero-description{font-size:var(--font-base);color:var(--muted);max-width:600px;margin:0 auto var(--space-lg);animation:fadeInUp 1s ease .4s forwards;opacity:0}
@media(min-width:480px){.hero-description{font-size:var(--font-lg);margin-bottom:var(--space-xl)}}
.hero-description strong{color:var(--text)}
.hero-cta-group{display:flex;flex-direction:column;gap:var(--space-sm);animation:fadeInUp 1s ease .6s forwards;opacity:0}
@media(min-width:480px){.hero-cta-group{flex-direction:row;justify-content:center;gap:var(--space-md)}}
.hero-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-lg);margin-top:var(--space-xl);animation:fadeInUp 1s ease .8s forwards;opacity:0}
@media(min-width:480px){.hero-stats{gap:var(--space-xl);margin-top:var(--space-2xl)}}
.hero-stat{text-align:center}
.hero-stat-value{font-size:var(--font-2xl);font-weight:700;color:var(--primary)}
@media(min-width:480px){.hero-stat-value{font-size:var(--font-3xl)}}
.hero-stat-label{font-size:var(--font-xs);color:var(--muted)}
.hero-scroll{position:absolute;bottom:var(--space-md);left:50%;transform:translateX(-50%);color:var(--muted);animation:bounce 2s infinite;display:none}
@media(min-width:480px) and (min-height:700px){.hero-scroll{display:block}}

/* BTN */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:.875rem 1.5rem;font-size:var(--font-sm);font-weight:700;border-radius:var(--radius-full);border:none;cursor:pointer;transition:var(--transition);text-align:center;white-space:nowrap}
@media(min-width:480px){.btn{padding:1rem 2rem;font-size:var(--font-base)}}
.btn-primary{background:var(--primary);color:#000}
.btn-primary:hover{transform:scale(1.05);box-shadow:var(--shadow-glow)}
.btn-secondary{background:transparent;border:2px solid var(--primary);color:var(--primary)}
.btn-secondary:hover{background:var(--primary);color:#000}
.btn-full{width:100%}

/* SECTION HEADER */
.section-header{text-align:center;margin-bottom:var(--space-xl)}
@media(min-width:768px){.section-header{margin-bottom:var(--space-2xl)}}
.section-title{font-size:var(--font-3xl);font-weight:800;margin-bottom:var(--space-sm)}
@media(min-width:768px){.section-title{font-size:var(--font-4xl)}}
.section-title span{color:var(--primary)}
.section-title .accent-orange{color:var(--accent)}
.section-title .accent-blue{color:var(--secondary)}
.section-description{font-size:var(--font-base);color:var(--muted);max-width:600px;margin:0 auto}
@media(min-width:768px){.section-description{font-size:var(--font-lg)}}

/* SERVICES */
.services-grid{display:grid;gap:var(--space-md)}
@media(min-width:600px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.services-grid{grid-template-columns:repeat(4,1fr)}}
.service-card{background:linear-gradient(145deg,rgba(26,26,26,0.9),rgba(0,119,255,0.05));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:.5s cubic-bezier(0.2,0.8,0.2,1);position:relative;overflow:hidden}
@media(min-width:768px){.service-card{padding:var(--space-xl)}}
.service-card::before{content:'';position:absolute;inset:-2px;background:linear-gradient(45deg,var(--primary),var(--secondary),var(--accent));border-radius:inherit;opacity:0;transition:opacity var(--transition);z-index:-1}
.service-card:hover::before{opacity:.5}
.service-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,255,170,0.15)}
.service-icon{width:40px;height:40px;color:var(--primary);margin-bottom:var(--space-sm);transition:.5s cubic-bezier(0.2,0.8,0.2,1)}
@media(min-width:768px){.service-icon{width:48px;height:48px;margin-bottom:var(--space-md)}}
.service-card:hover .service-icon{transform:scale(1.2) rotate(360deg)}
.service-title{font-size:var(--font-lg);font-weight:700;margin-bottom:var(--space-xs)}
@media(min-width:768px){.service-title{font-size:var(--font-xl);margin-bottom:var(--space-sm)}}
.service-description{color:var(--muted);margin-bottom:var(--space-sm);font-size:var(--font-sm);line-height:1.5}
.service-price{color:var(--primary);font-weight:700;font-size:var(--font-base)}
@media(min-width:768px){.service-price{font-size:var(--font-lg)}}

/* STATS */
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm);margin-top:var(--space-xl)}
@media(min-width:768px){.stats-grid{grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-top:var(--space-2xl)}}
.stat-card{background:rgba(0,255,170,0.05);border:1px solid rgba(0,255,170,0.2);border-radius:var(--radius-md);padding:var(--space-md);text-align:center;transition:var(--transition)}
@media(min-width:768px){.stat-card{padding:var(--space-lg)}}
.stat-card:hover{background:rgba(0,255,170,0.1);transform:scale(1.05)}
.stat-emoji{font-size:var(--font-xl);margin-bottom:var(--space-xs)}
@media(min-width:768px){.stat-emoji{font-size:var(--font-2xl)}}
.stat-label{font-weight:600;font-size:var(--font-sm);margin-bottom:var(--space-xs)}
.stat-sublabel{color:var(--muted);font-size:var(--font-xs)}

/* PROJECTS */
.projects-list{display:flex;flex-direction:column;gap:var(--space-xl)}
.project-card{background:rgba(26,26,26,0.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-md);transition:var(--transition)}
@media(min-width:768px){.project-card{padding:var(--space-xl)}}
.project-card:hover{border-color:rgba(0,255,170,0.3);transform:translateY(-5px)}
.project-inner{display:grid;gap:var(--space-lg)}
@media(min-width:768px){.project-inner{grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:center}.project-card:nth-child(even) .project-image-wrap{order:2}}
.project-image-wrap{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border)}
.project-image{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .6s ease}
.project-card:hover .project-image{transform:scale(1.08)}
.project-category{font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--primary)}
.project-category.orange{color:var(--accent)}
.project-category.blue{color:var(--secondary)}
.project-title{font-size:var(--font-xl);font-weight:700;margin:var(--space-xs) 0 var(--space-sm)}
@media(min-width:768px){.project-title{font-size:var(--font-2xl)}}
.project-description{color:var(--muted);margin-bottom:var(--space-md);font-size:var(--font-sm)}
.project-tags{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-bottom:var(--space-md)}
.project-tag{padding:.25rem .75rem;background:rgba(0,255,170,0.1);color:var(--primary);border-radius:var(--radius-full);font-size:var(--font-xs);font-weight:500}
.project-tag.orange{background:rgba(255,136,0,0.1);color:var(--accent)}
.project-tag.blue{background:rgba(0,119,255,0.1);color:var(--secondary)}
.project-link{display:inline-flex;align-items:center;gap:var(--space-xs);color:var(--primary);font-weight:700;font-size:var(--font-sm);transition:var(--transition)}
.project-link:hover{text-decoration:underline}
.project-link svg{width:18px;height:18px;transition:var(--transition)}
.project-link:hover svg{transform:translateX(5px)}

/* PROCESS */
.process-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md)}
@media(min-width:768px){.process-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-lg)}}
.process-step{width:100%;aspect-ratio:1;max-width:140px;border:3px solid var(--primary);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-sm);background:radial-gradient(circle,rgba(0,255,170,0.1),transparent);transition:.5s cubic-bezier(0.2,0.8,0.2,1);margin:0 auto}
@media(min-width:768px){.process-step{width:160px;max-width:none}}
.process-step:hover{background:var(--primary);color:#000;transform:scale(1.1);box-shadow:0 0 40px rgba(0,255,170,0.6)}
.process-step.orange{border-color:var(--accent);background:radial-gradient(circle,rgba(255,136,0,0.1),transparent)}
.process-step.orange:hover{background:var(--accent);box-shadow:0 0 40px rgba(255,136,0,0.6)}
.process-number{font-size:var(--font-xl);font-weight:700}
@media(min-width:768px){.process-number{font-size:var(--font-2xl)}}
.process-title{font-size:var(--font-sm);font-weight:600}
.process-subtitle{font-size:var(--font-xs);opacity:.7}

/* PRICING */
.pricing-grid{display:grid;gap:var(--space-md)}
@media(min-width:768px){.pricing-grid{grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}}
.pricing-card{background:linear-gradient(145deg,rgba(26,26,26,0.9),rgba(0,119,255,0.05));border:2px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:.5s cubic-bezier(0.2,0.8,0.2,1);position:relative}
@media(min-width:768px){.pricing-card{padding:var(--space-xl)}}
.pricing-card:hover{transform:translateY(-10px);border-color:var(--primary);box-shadow:0 20px 50px rgba(0,255,170,0.15)}
.pricing-card.featured{border-color:var(--primary);box-shadow:0 10px 30px rgba(0,255,170,0.15)}
.pricing-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--primary);color:#000;padding:.25rem 1rem;border-radius:var(--radius-full);font-size:var(--font-xs);font-weight:700}
.pricing-name{font-size:var(--font-xl);font-weight:700;margin-bottom:var(--space-xs)}
.pricing-description{color:var(--muted);font-size:var(--font-sm);margin-bottom:var(--space-md)}
.pricing-price{margin-bottom:var(--space-md)}
.pricing-amount{font-size:var(--font-2xl);font-weight:700;color:var(--primary)}
@media(min-width:768px){.pricing-amount{font-size:var(--font-3xl)}}
.pricing-suffix{color:var(--muted)}
.pricing-features{list-style:none;margin-bottom:var(--space-lg)}
.pricing-feature{display:flex;align-items:flex-start;gap:var(--space-sm);margin-bottom:var(--space-sm);font-size:var(--font-sm)}
.pricing-feature svg{width:18px;height:18px;color:var(--primary);flex-shrink:0;margin-top:2px}
.pricing-note{text-align:center;color:var(--muted);font-size:var(--font-sm);margin-top:var(--space-lg)}

/* FAQ */
.faq-list{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-sm)}
.faq-item{background:rgba(26,26,26,0.6);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:var(--transition)}
.faq-item:hover{border-color:rgba(0,255,170,0.3)}
.faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;padding:var(--space-md);background:none;border:none;color:var(--text);font-size:var(--font-sm);font-weight:600;text-align:left;cursor:pointer;gap:var(--space-sm)}
@media(min-width:768px){.faq-question{padding:var(--space-lg);font-size:var(--font-base)}}
.faq-question svg{width:20px;height:20px;color:var(--primary);transition:var(--transition);flex-shrink:0}
.faq-item.active .faq-question svg{transform:rotate(180deg)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(0.2,0.8,0.2,1)}
.faq-item.active .faq-answer{max-height:500px}
.faq-answer-inner{padding:0 var(--space-md) var(--space-md);color:var(--muted);font-size:var(--font-sm);line-height:1.7}
@media(min-width:768px){.faq-answer-inner{padding:0 var(--space-lg) var(--space-lg)}}

/* CONTACT */
.contact-grid{display:grid;gap:var(--space-xl)}
@media(min-width:768px){.contact-grid{grid-template-columns:1fr 1fr}}
.contact-info-title{font-size:var(--font-xl);font-weight:700;margin-bottom:var(--space-lg)}
.contact-info-list{display:flex;flex-direction:column;gap:var(--space-md)}
.contact-info-item{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-md);background:rgba(0,0,0,0.4);border-radius:var(--radius-md);transition:var(--transition)}
.contact-info-item:hover{background:rgba(0,0,0,0.6)}
.contact-info-icon{width:44px;height:44px;background:rgba(0,255,170,0.1);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.contact-info-icon svg{width:20px;height:20px;color:var(--primary)}
.contact-info-label{font-size:var(--font-xs);color:var(--muted);margin-bottom:2px}
.contact-info-value{font-weight:600;font-size:var(--font-sm);transition:var(--transition)}
a.contact-info-value:hover{color:var(--primary)}
.contact-info-sub{font-size:var(--font-xs);color:var(--muted)}
.contact-availability{margin-top:var(--space-lg);padding:var(--space-md);background:rgba(0,255,170,0.05);border:1px solid rgba(0,255,170,0.2);border-radius:var(--radius-md)}
.contact-availability-title{color:var(--primary);font-weight:700;margin-bottom:var(--space-xs);font-size:var(--font-sm)}
.contact-availability-text{color:var(--muted);font-size:var(--font-sm);line-height:1.6}

/* FORM */
.form{display:flex;flex-direction:column;gap:var(--space-md)}
.form-row{display:grid;gap:var(--space-md)}
@media(min-width:480px){.form-row{grid-template-columns:1fr 1fr}}
.form-group{display:flex;flex-direction:column;gap:var(--space-xs)}
.form-label{font-size:var(--font-sm);font-weight:500;color:var(--muted)}
.form-input,.form-select,.form-textarea{width:100%;padding:var(--space-sm) var(--space-md);background:var(--card);border:1px solid #333;border-radius:var(--radius-md);color:var(--text);transition:var(--transition);font-size:var(--font-base)}
@media(min-width:768px){.form-input,.form-select,.form-textarea{padding:var(--space-md)}}
.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--primary);background:#000;box-shadow:0 0 15px rgba(0,255,170,0.2)}
.form-input::placeholder,.form-textarea::placeholder{color:#666}
.form-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:1.25rem;padding-right:2.5rem}
.form-textarea{resize:vertical;min-height:100px}
.form-message{padding:var(--space-md);border-radius:var(--radius-md);text-align:center;font-weight:500;font-size:var(--font-sm);display:none}
.form-message.success{display:block;background:rgba(0,255,170,0.1);border:1px solid rgba(0,255,170,0.3);color:var(--primary)}
.form-message.error{display:block;background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);color:#ef4444}
.form-submit{position:relative}
.form-submit .btn-loading{display:none}
.form-submit.loading .btn-text{visibility:hidden}
.form-submit.loading .btn-loading{display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.form-honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.form-check{display:flex;align-items:flex-start;gap:.5rem}
.form-check-input{margin-top:3px;accent-color:var(--primary);flex-shrink:0}
.form-check-label{font-size:var(--font-xs);color:var(--muted);line-height:1.5}
.form-check-label a{color:var(--primary);text-decoration:underline}

/* CTA FINAL */
.cta-final{text-align:center}
.cta-final-title{font-size:var(--font-2xl);font-weight:700;margin-bottom:var(--space-md)}
@media(min-width:768px){.cta-final-title{font-size:var(--font-3xl)}}
.cta-final-typed{color:var(--primary)}
.cta-final-typed::after{content:'_';animation:blink .7s infinite}
.cta-final-description{font-size:var(--font-base);color:var(--muted);margin-bottom:var(--space-lg)}
@media(min-width:768px){.cta-final-description{font-size:var(--font-lg);margin-bottom:var(--space-xl)}}

/* MODAL */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:var(--space-md);opacity:0;visibility:hidden;transition:var(--transition)}
.modal.open{opacity:1;visibility:visible}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.modal-content{position:relative;background:var(--card);border:1px solid #333;border-radius:var(--radius-lg);padding:var(--space-lg);width:100%;max-width:500px;max-height:90vh;overflow-y:auto;transform:scale(0.95);transition:var(--transition)}
@media(min-width:768px){.modal-content{padding:var(--space-xl)}}
.modal.open .modal-content{transform:scale(1)}
.modal-close{position:absolute;top:var(--space-sm);right:var(--space-sm);background:none;border:none;color:var(--muted);cursor:pointer;padding:5px;transition:var(--transition)}
.modal-close:hover{color:var(--text)}
.modal-close svg{width:24px;height:24px}
.modal-title{font-size:var(--font-xl);font-weight:700;margin-bottom:var(--space-xs);padding-right:var(--space-xl)}
@media(min-width:768px){.modal-title{font-size:var(--font-2xl);margin-bottom:var(--space-sm)}}
.modal-description{color:var(--muted);margin-bottom:var(--space-lg);font-size:var(--font-sm)}

/* FOOTER */
.footer{background:var(--bg-alt);border-top:1px solid var(--border);padding:var(--space-xl) 0 var(--space-lg)}
.footer-grid{display:grid;gap:var(--space-lg);margin-bottom:var(--space-xl)}
@media(min-width:600px){.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.footer-brand{display:flex;align-items:center;gap:var(--space-xs);margin-bottom:var(--space-sm)}
.footer-brand img{height:40px;width:auto;object-fit:contain}
.footer-description{color:var(--muted);font-size:var(--font-sm)}
.footer-title{font-weight:700;margin-bottom:var(--space-sm);font-size:var(--font-sm)}
@media(min-width:768px){.footer-title{margin-bottom:var(--space-md)}}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:var(--space-xs)}
.footer-links a{color:var(--muted);font-size:var(--font-sm);transition:var(--transition)}
.footer-links a:hover{color:var(--text)}
.footer-bottom{padding-top:var(--space-lg);border-top:1px solid var(--border);text-align:center}
.footer-legal{color:var(--muted);font-size:var(--font-xs);line-height:1.6}

/* COOKIE BANNER */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:150;background:rgba(17,17,17,0.98);border-top:1px solid var(--border);padding:var(--space-md)}
.cookie-content{max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);flex-wrap:wrap}
.cookie-content p{color:var(--muted);font-size:var(--font-xs);flex:1}
.cookie-content a{color:var(--primary);text-decoration:underline}

/* AUTH PAGES */
.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:calc(var(--header-h) + env(safe-area-inset-top, 0px) + var(--space-xl)) var(--space-md) var(--space-xl)}
.auth-card{background:rgba(17,17,17,0.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);width:100%;max-width:480px}
.auth-title{font-size:var(--font-2xl);font-weight:800;margin-bottom:var(--space-xs);text-align:center}
.auth-subtitle{color:var(--muted);font-size:var(--font-sm);text-align:center;margin-bottom:var(--space-xl)}
.auth-footer{text-align:center;margin-top:var(--space-lg);color:var(--muted);font-size:var(--font-sm)}
.auth-footer a{color:var(--primary);font-weight:600}
.auth-alert{padding:var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-md);font-size:var(--font-sm);font-weight:500}
.auth-alert.error{background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);color:#ef4444}
.auth-alert.success{background:rgba(0,255,170,0.1);border:1px solid rgba(0,255,170,0.3);color:var(--primary)}

/* DASHBOARD */
.dashboard-layout{display:flex;min-height:100vh}
.sidebar{width:260px;background:rgba(10,10,10,0.98);border-right:1px solid var(--border);position:fixed;top:0;left:0;height:100%;z-index:50;display:flex;flex-direction:column;transition:var(--transition)}
.sidebar-header{padding:var(--space-lg);border-bottom:1px solid var(--border)}
.sidebar-logo img{height:40px;width:auto}
.sidebar-nav{flex:1;padding:var(--space-md);overflow-y:auto}
.sidebar-section{margin-bottom:var(--space-md)}
.sidebar-section-title{font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:var(--space-sm);padding:0 var(--space-sm)}
.sidebar-link{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--muted);font-size:var(--font-sm);font-weight:500;transition:var(--transition);margin-bottom:2px;text-decoration:none}
.sidebar-link:hover,.sidebar-link.active{background:rgba(0,255,170,0.1);color:var(--primary)}
.sidebar-link svg{width:18px;height:18px;flex-shrink:0}
.sidebar-footer{padding:var(--space-md);border-top:1px solid var(--border)}
.sidebar-user{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm)}
.sidebar-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--font-sm);color:#000;flex-shrink:0}
.sidebar-user-name{font-size:var(--font-sm);font-weight:600}
.sidebar-user-role{font-size:var(--font-xs);color:var(--muted)}
.dashboard-main{margin-left:260px;flex:1;padding:var(--space-xl);min-height:100vh;background:var(--bg)}
@media(max-width:900px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.dashboard-main{margin-left:0}}
.dashboard-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-xl)}
.dashboard-title{font-size:var(--font-2xl);font-weight:700}
.dashboard-subtitle{color:var(--muted);font-size:var(--font-sm)}
.card{background:rgba(17,17,17,0.8);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg)}
.card-title{font-size:var(--font-lg);font-weight:700;margin-bottom:var(--space-md)}
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md);margin-bottom:var(--space-xl)}
.stat-box{background:rgba(17,17,17,0.8);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg)}
.stat-box-value{font-size:var(--font-3xl);font-weight:700;color:var(--primary)}
.stat-box-label{color:var(--muted);font-size:var(--font-sm)}
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border);color:var(--muted);font-size:var(--font-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.table td{padding:var(--space-sm) var(--space-md);border-bottom:1px solid rgba(255,255,255,0.05);font-size:var(--font-sm)}
.badge{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:var(--font-xs);font-weight:600}
.badge-green{background:rgba(0,255,170,0.1);color:var(--primary)}
.badge-orange{background:rgba(255,136,0,0.1);color:var(--accent)}
.badge-red{background:rgba(239,68,68,0.1);color:#ef4444}
.badge-blue{background:rgba(0,119,255,0.1);color:var(--secondary)}
.badge-gray{background:rgba(156,163,175,0.1);color:var(--muted)}

/* ANIMATIONS */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-10px)}}
.scroll-animate{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}
.scroll-animate.visible{opacity:1;transform:translateY(0)}
noscript .hero-title-typed::after{display:none}