
:root{--bg:#fff;--bg-alt:#f5f5f7;--text:#1d1d1f;--text-2:#6e6e73;--accent:#0066cc;--border:#d2d2d7;--font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;--bg-primary:#fff;--bg-secondary:#f5f5f7;--bg-card:#fff;--accent-light:#0066cc;--text-primary:#1d1d1f;--text-secondary:#6e6e73;--gradient:linear-gradient(135deg,#0066cc,#0077ed);--paper:#fff;--muted:#f5f5f7;--sub:#6e6e73;--green:#0066cc;--green-2:#0077ed;--teal:#0066cc;--gold:#0066cc;--line:#d2d2d7;--shadow:0 18px 44px rgba(0,0,0,.09);--radius:24px}
html{scroll-padding-top:90px}body{background:#fff;color:#1d1d1f;font-family:var(--font-sans);font-size:17px;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,.brand,.logo{font-family:var(--font-sans)}h1{font-size:76px!important;letter-spacing:-.028em!important;font-weight:650!important;line-height:1.06!important}h2,.section-title{font-size:44px!important;letter-spacing:-.022em!important;font-weight:600;line-height:1.13}h3{font-size:23px;letter-spacing:-.018em}header,.site-header{background:rgba(255,255,255,.88);backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,0,0,.08);box-shadow:none}nav a,.nav{font-size:13px;font-weight:500;color:#6e6e73}a{color:#0066cc}.btn{border-radius:999px;font-size:15px;font-weight:500;padding:13px 25px;box-shadow:none}.btn-primary{background:#0066cc;color:#fff;box-shadow:none}.btn-secondary{background:transparent;color:#0066cc;border:1px solid #d2d2d7}.btn:hover{box-shadow:0 6px 18px #0000000c}.hero{background:#fff}.hero h1 span{background:none;-webkit-text-fill-color:#0066cc;color:#0066cc}.hero-badge,.trust-row span,.tag{background:#f5f5f7;color:#0066cc;border:1px solid #e8e8ed}.hero-tagline,.hero-text,.lead{color:#6e6e73;line-height:1.6}.section-title:before{display:none}.skill-card,.project-card,.video-card,.contact-card,.problem-grid article,.usecase-grid article,.card,.story-card{background:#fff;border:1px solid #e5e5e9;border-radius:24px;box-shadow:0 1px 2px #00000008;transition:box-shadow .25s,transform .25s}.skill-card:hover,.project-card:hover,.video-card:hover,.contact-card:hover,.card:hover{box-shadow:0 18px 44px #00000017;border-color:#d2d2d7;transform:translateY(-3px)}.skill-icon,.icon{background:#f5f5f7;color:#0066cc;border-radius:14px}.project-thumb,.video-thumb{background:#f5f5f7}.about-quote{background:#f5f5f7;border:0;border-radius:24px;padding:32px;color:#6e6e73}.hero-visual,.process-visual{background:#f5f5f7;border:1px solid #e5e5e9;border-radius:24px;padding:10px;box-shadow:none}.hero-visual img,.process-visual img{border-radius:18px}.muted{background:#f5f5f7}.eyebrow{color:#6e6e73;letter-spacing:.07em;font-weight:600;font-size:12px}.brand-mark{background:#0066cc;box-shadow:none;border-radius:12px}.nav-cta{background:#0066cc;color:#fff;border:0}.cta-box{background:#f5f5f7!important;color:#1d1d1f!important;border:1px solid #e5e5e9;box-shadow:none}.cta-box h2{color:#1d1d1f!important}.cta-box p{color:#6e6e73!important}.cta-box .btn{background:#0066cc;color:#fff}.timeline-title,.project-title{color:#1d1d1f}footer,.footer{background:#f5f5f7;color:#6e6e73;border-top:1px solid #e5e5e9}.play-icon{background:#e9f2fc!important;color:#0066cc!important}a:focus-visible{outline:3px solid #0066cc;outline-offset:4px}
@media(max-width:800px){h1{font-size:48px!important}h2,.section-title{font-size:34px!important}}@media(max-width:480px){h1{font-size:40px!important}h2,.section-title{font-size:30px!important}.skills-grid,.projects-grid,.video-grid,.contact-grid{grid-template-columns:1fr}.container{padding:0 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
header{padding:17px 0}.container{max-width:1120px}section{padding:92px 0}section:nth-of-type(even){background:#f5f5f7}.hero{padding:115px 0 100px!important}.hero-badge{padding:7px 16px}.hero h1{margin-bottom:20px}.hero-tagline{font-size:25px}.hero-years{color:#6e6e73;margin-bottom:30px}.section-title{margin-bottom:36px}.project-body{padding:28px}.contact-value{overflow-wrap:anywhere}@media(max-width:768px){section{padding:60px 0}.hero{padding:75px 0 65px!important}header .container{flex-wrap:wrap;gap:12px}nav{display:flex;gap:15px;flex-wrap:wrap}nav a{font-size:12px}.hero-tagline{font-size:21px}}