@layer reset,base,tokens,layout,components,animations;@layer tokens{:root{--bg-obsidian: #08080a;--bg-surface: #121216;--bg-surface-elevated: #1a1a20;--bg-card: rgba(22, 22, 28, .65);--bg-card-hover: rgba(32, 32, 42, .85);--text-primary: #f5f5f7;--text-secondary: #a1a1a6;--text-tertiary: #6e6e73;--accent-cyan: #00f0ff;--accent-purple: #8a2be2;--accent-blue: #0071e3;--accent-green: #00ff88;--gradient-primary: linear-gradient(135deg, #00f0ff 0%, #8a2be2 100%);--gradient-text: linear-gradient(90deg, #ffffff 0%, #a1a1a6 50%, #00f0ff 100%);--gradient-glow: radial-gradient(circle at 50% 0%, rgba(0, 240, 255, .15) 0%, rgba(138, 43, 226, .05) 50%, transparent 100%);--border-glass: rgba(255, 255, 255, .08);--border-glass-hover: rgba(0, 240, 255, .3);--glass-blur: blur(24px);--shadow-card: 0 20px 40px rgba(0, 0, 0, .6);--shadow-glow: 0 0 30px rgba(0, 240, 255, .2);--font-main: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", sans-serif;--font-mono: "SF Mono", "Fira Code", "Roboto Mono", monospace;--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--transition-fast: .2s cubic-bezier(.25, .1, .25, 1);--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1)}}@layer reset{*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:130px;color-scheme:dark}body{background-color:var(--bg-obsidian);color:var(--text-primary);font-family:var(--font-main);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none;transition:color var(--transition-fast)}ul,ol{list-style:none}img{max-width:100%;height:auto;display:block}button{font-family:inherit;border:none;background:none;cursor:pointer}}@layer base{::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-obsidian)}::-webkit-scrollbar-thumb{background:#2a2a32;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}h1,h2,h3,h4{font-weight:700;letter-spacing:-.02em;line-height:1.15}h1{font-size:clamp(2.8rem,6vw,5.5rem)}h2{font-size:clamp(2rem,4vw,3.5rem);margin-bottom:1rem}h3{font-size:clamp(1.4rem,2.5vw,2rem);margin-bottom:.75rem}p{color:var(--text-secondary);font-size:clamp(1rem,1.25vw,1.2rem)}}@layer layout{.container{width:100%;max-width:1280px;margin:0 auto;padding:0 2rem}section{position:relative;padding:8rem 0}.bg-glow{position:absolute;top:0;left:50%;transform:translate(-50%);width:100vw;height:100%;background:var(--gradient-glow);z-index:-1;pointer-events:none}.navbar{position:fixed;top:0;left:0;width:100%;background:#08080ad9;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border-glass);z-index:1000;display:flex;flex-direction:column;transition:background var(--transition-fast);box-shadow:0 4px 25px #0009}.nav-container{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1280px;margin:0 auto;padding:0 2rem}.nav-top{height:65px}.nav-bottom{min-height:42px;border-top:1px solid rgba(255,255,255,.06);background:#12121a73;justify-content:center;gap:1.5rem;padding-top:.4rem;padding-bottom:.4rem;flex-wrap:wrap}.nav-sub-label{font-size:.8rem;font-weight:700;color:var(--accent-cyan);text-transform:uppercase;letter-spacing:.05em;font-family:var(--font-mono)}.nav-links-sub{display:flex;gap:1.2rem;flex-wrap:wrap;justify-content:center;align-items:center}.nav-link-sub{font-size:.85rem;font-weight:500;color:var(--text-secondary);transition:all var(--transition-fast);padding:.25rem .6rem;border-radius:6px;background:#ffffff08;border:1px solid transparent}.nav-link-sub:hover{color:var(--accent-cyan);background:#00f0ff1a;border-color:#00f0ff4d;transform:translateY(-1px)}.logo{font-size:1.5rem;font-weight:800;letter-spacing:-.03em;background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:center;gap:.5rem}.nav-links{display:flex;gap:2rem}.nav-lab-logo{display:flex;align-items:center}.nav-lab-logo img{height:38px;width:auto;border-radius:6px;transition:transform var(--transition-fast),filter var(--transition-fast)}.nav-lab-logo img:hover{transform:scale(1.05);filter:brightness(1.1)}.nav-links a{font-size:.95rem;font-weight:500;color:var(--text-secondary);padding:.5rem 0;position:relative}.nav-links a:hover,.nav-links a.active{color:var(--text-primary)}.nav-links a:after{content:"";position:absolute;bottom:0;left:0;width:0%;height:2px;background:var(--gradient-primary);transition:width var(--transition-smooth)}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.footer{background:var(--bg-surface);border-top:1px solid var(--border-glass);padding:5rem 0 3rem;font-size:.9rem;color:var(--text-tertiary)}.footer-content{display:grid;grid-template-columns:repeat(3,1fr);gap:4rem;margin-bottom:4rem}.footer-col h4{color:var(--text-primary);font-size:1.1rem;margin-bottom:1.2rem}.footer-col p{font-size:.95rem;line-height:1.7}.footer-bottom{padding-top:2rem;border-top:1px solid rgba(255,255,255,.05);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}}@layer components{.hero{min-height:100vh;display:flex;align-items:center;padding-top:140px;text-align:center;overflow:hidden}.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem 1rem;background:#00f0ff14;border:1px solid rgba(0,240,255,.2);border-radius:50px;color:var(--accent-cyan);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2rem;box-shadow:var(--shadow-glow)}.hero-title-gradient{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-subtitle{max-width:750px;margin:1.5rem auto 3rem;font-size:clamp(1.1rem,1.5vw,1.4rem);color:var(--text-secondary)}.hero-actions{display:flex;justify-content:center;gap:1.5rem;margin-bottom:4rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.9rem 2.2rem;border-radius:50px;font-size:1rem;font-weight:600;transition:all var(--transition-smooth)}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 10px 25px #00f0ff40}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 15px 35px #00f0ff66}.btn-secondary{background:#ffffff0d;color:var(--text-primary);border:1px solid var(--border-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-secondary:hover{background:#ffffff1a;border-color:#ffffff4d;transform:translateY(-2px)}.hero-image-wrapper{position:relative;max-width:1100px;margin:0 auto;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-glass);box-shadow:0 30px 60px #000c,var(--shadow-glow)}.hero-image-wrapper:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 60%,var(--bg-obsidian) 100%);pointer-events:none}.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:2.5rem}.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem}.glass-card{background:var(--bg-card);border:1px solid var(--border-glass);border-radius:var(--radius-lg);padding:2.5rem;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);transition:all var(--transition-smooth);position:relative;overflow:hidden}.glass-card:hover{background:var(--bg-card-hover);border-color:var(--border-glass-hover);transform:translateY(-6px);box-shadow:var(--shadow-card),0 0 25px #00f0ff1a}.card-icon{width:56px;height:56px;border-radius:var(--radius-md);background:#00f0ff1a;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:var(--accent-cyan);margin-bottom:1.5rem}.card-icon.purple{background:#8a2be21a;color:var(--accent-purple)}.section-header{text-align:center;max-width:800px;margin:0 auto 5rem}.section-tag{color:var(--accent-cyan);font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem;display:block}.calc-box{background:var(--bg-surface-elevated);border:1px solid var(--border-glass);border-radius:var(--radius-xl);padding:3rem;margin-top:4rem;box-shadow:var(--shadow-card)}.calc-header{text-align:center;margin-bottom:2.5rem}.calc-slider-container{max-width:600px;margin:0 auto 3rem;text-align:center}.calc-slider-label{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.calc-slider-val{font-size:2rem;font-weight:800;color:var(--accent-cyan);font-family:var(--font-mono)}input[type=range]{-webkit-appearance:none;width:100%;height:8px;background:#2a2a35;border-radius:4px;outline:none;transition:background .3s}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:28px;height:28px;border-radius:50%;background:var(--accent-cyan);cursor:pointer;box-shadow:0 0 15px var(--accent-cyan);transition:transform var(--transition-fast)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}.calc-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.result-card{background:#0006;border:1px solid var(--border-glass);border-radius:var(--radius-md);padding:1.8rem;text-align:center;transition:border-color var(--transition-fast)}.result-card:hover{border-color:var(--accent-cyan)}.result-title{font-size:.9rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.8rem}.result-number{font-size:2.5rem;font-weight:800;color:#fff;font-family:var(--font-mono);margin-bottom:.5rem}.result-desc{font-size:.85rem;color:var(--text-tertiary)}.tabs-container{margin-top:4rem}.tab-buttons{display:flex;justify-content:center;gap:1rem;margin-bottom:3rem;flex-wrap:wrap}.tab-btn{padding:.8rem 2rem;border-radius:50px;background:#ffffff0a;border:1px solid var(--border-glass);color:var(--text-secondary);font-size:1rem;font-weight:600;transition:all var(--transition-fast)}.tab-btn:hover{background:#ffffff14;color:var(--text-primary)}.tab-btn.active{background:var(--gradient-primary);color:#fff;border-color:transparent;box-shadow:0 5px 20px #00f0ff4d}.tab-content{display:none;animation:fadeIn .5s cubic-bezier(.16,1,.3,1)}.tab-content.active{display:block}.image-card{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-glass);box-shadow:var(--shadow-card);margin:3rem 0}.badge-row{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.5rem 0}.tech-badge{padding:.35rem .85rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);font-size:.8rem;font-family:var(--font-mono);color:var(--accent-cyan)}}@layer animations{@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}.reveal.active{opacity:1;transform:translateY(0)}}@media (max-width: 768px){body{overflow-x:hidden;-webkit-tap-highlight-color:transparent}.container{padding:0 1.25rem}section{padding:4.5rem 0}.navbar{height:auto;padding:.8rem 0}.nav-container{flex-wrap:wrap;gap:.8rem;justify-content:space-between}.nav-links{display:flex!important;width:100%;overflow-x:auto;padding:.4rem 0 .6rem;gap:1.4rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;white-space:nowrap;order:3}.nav-links::-webkit-scrollbar{display:none}.nav-bottom{display:none!important}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr!important;gap:1.5rem}.calc-box{padding:1.8rem 1.2rem;margin-top:2.5rem}.calc-results{grid-template-columns:1fr;gap:1.2rem}.calc-slider-label{flex-direction:column;align-items:flex-start;gap:.4rem}.calc-slider-val{font-size:1.6rem}.hero{padding-top:130px;min-height:auto;padding-bottom:4rem}.hero-title,h1{font-size:clamp(2.2rem,8vw,3.2rem)!important}h2{font-size:clamp(1.8rem,6vw,2.6rem)!important}h3{font-size:clamp(1.3rem,4vw,1.8rem)!important}.glass-card{padding:1.8rem 1.4rem}.tab-buttons{gap:.6rem;margin-bottom:2rem}.tab-btn{padding:.6rem 1.2rem;font-size:.9rem;flex:1 1 calc(50% - .6rem);text-align:center}.footer-content{grid-template-columns:1fr!important;gap:2.5rem}}@media (max-width: 480px){.container{padding:0 1rem}.hero-title,h1{font-size:2rem!important}h2{font-size:1.6rem!important}.hero-actions{flex-direction:column;width:100%;gap:.8rem}.hero-actions .btn{width:100%;text-align:center;justify-content:center}.tab-btn{flex:1 1 100%}.glass-card{padding:1.5rem 1.2rem}.result-number{font-size:2rem}.badge-row{gap:.5rem}.tech-badge{font-size:.75rem;padding:.25rem .6rem}}.antibot-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d1;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .35s cubic-bezier(.16,1,.3,1)}.antibot-overlay.active{opacity:1;pointer-events:auto}.antibot-card{width:100%;max-width:440px;background:#1c1c1ed9;border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:28px;box-shadow:0 25px 50px -12px #000c;transform:scale(.95);transition:transform .35s cubic-bezier(.16,1,.3,1)}.antibot-overlay.active .antibot-card{transform:scale(1)}.antibot-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.08)}.antibot-close{background:#ffffff14;border:none;color:var(--text-secondary);width:32px;height:32px;border-radius:50%;font-size:1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.antibot-close:hover{background:#ffffff2e;color:#fff}.slider-verify-container{position:relative;width:100%;height:56px;background:#000;border:1px solid rgba(255,255,255,.15);border-radius:28px;overflow:hidden;display:flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none;touch-action:none}.slider-track-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#00f0ff33,#0f89);transition:width .05s linear}.slider-text{position:relative;z-index:2;font-size:.88rem;font-weight:600;color:var(--text-secondary);letter-spacing:.02em;pointer-events:none;transition:color .3s}.slider-thumb{position:absolute;left:4px;top:4px;width:46px;height:46px;background:var(--accent-cyan);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#000;font-size:1.2rem;cursor:grab;box-shadow:0 4px 12px #00f0ff80;z-index:3;transition:transform .05s linear,background .3s}.slider-thumb:active{cursor:grabbing}.slider-thumb.success{background:var(--accent-green);color:#000;box-shadow:0 4px 15px #00ff88b3}
