:root{--color-bg: #0a0a0a;--color-text: #ffffff;--color-accent: #e50914;--font-main: "Inter", system-ui, sans-serif;--spacing-sm: 12px;--spacing-md: 24px;--spacing-lg: 36px;--spacing-xl: 72px;--transition-smooth: cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;overflow-x:hidden}h1,h2,h3{font-weight:700;line-height:1.2}a{color:inherit;text-decoration:none;transition:opacity .3s ease}a:hover{opacity:.8}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.hero{position:relative;height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}.hero-bg{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.8;filter:brightness(.9) contrast(1.1)}.hero:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,#0000001a,#0006);z-index:-1;pointer-events:none}.hero-bg.mobile-bg{display:none}@media (max-width: 768px){.hero-bg:not(.mobile-bg){display:none}.hero-bg.mobile-bg{display:block}}.hero-content{position:relative;z-index:1}.hero h1{font-size:clamp(2.5rem,6vw,4.5rem);text-transform:uppercase;letter-spacing:-2px;margin-bottom:var(--spacing-sm);font-weight:800}.hero p{font-size:clamp(1rem,2vw,1.4rem);font-weight:600;letter-spacing:.4em;text-transform:uppercase;opacity:.7;margin-bottom:var(--spacing-lg)}.reveal{opacity:0;transform:translateY(30px);transition:opacity 1.2s var(--transition-smooth),transform 1.2s var(--transition-smooth)}.reveal.active{opacity:1;transform:translateY(0)}.btn{display:inline-block;padding:14px 32px;border:1px solid rgba(255,255,255,.08);background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--color-text);text-transform:uppercase;letter-spacing:1px;font-size:.9rem;font-weight:600;transition:all .4s cubic-bezier(.175,.885,.32,1.275);border-radius:24px;box-shadow:0 4px 30px #0000001a}.btn:hover{background:#ffffff1a;color:#fff;border-color:#fff6;transform:translateY(-5px) scale(1.02);box-shadow:0 10px 30px #0003}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.portfolio{padding:var(--spacing-xl) var(--spacing-md) 0}.portfolio h2{font-size:2rem;margin-bottom:var(--spacing-lg);text-transform:uppercase;letter-spacing:1px;text-align:center}.portfolio h2:not(:first-child){margin-top:var(--spacing-xl)}.grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-md)}.grid-item{position:relative;overflow:hidden;aspect-ratio:16/9;cursor:pointer;border-radius:4px;flex:1 1 300px;max-width:380px;min-width:280px}.grid-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.grid-item:hover img{transform:scale(1.05)}.grid-item:hover{box-shadow:0 10px 30px #00000080;transform:translateY(-5px);transition:transform .3s ease,box-shadow .3s ease}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:0;transition:opacity .3s ease;text-align:center;padding:var(--spacing-md)}.grid-item:hover .overlay{opacity:1}.overlay h3{font-size:1.2rem;margin-bottom:16px;transform:translateY(10px);transition:transform .6s var(--transition-smooth);letter-spacing:.05em}.overlay p{font-size:.7rem;color:var(--color-accent);text-transform:uppercase;letter-spacing:.2em;font-weight:600;transform:translateY(10px);transition:transform .6s var(--transition-smooth) .05s}.grid-item:hover .overlay p{transform:translateY(0)}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000000e6;align-items:center;justify-content:center}.modal-content{position:relative;width:90%;max-width:1000px;max-height:90vh;background:#000;box-shadow:0 4px 20px #00000080;overflow-y:auto;border-radius:8px;padding:var(--spacing-lg)}.modal-body{display:flex;flex-direction:column;gap:var(--spacing-lg)}.video-container{position:relative;width:100%;padding-bottom:56.25%;height:0;margin-bottom:var(--spacing-md);border-radius:8px;overflow:hidden;background:#000}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}.project-info{text-align:left;border-bottom:1px solid #333;padding-bottom:var(--spacing-md)}.project-info h2{font-size:2rem;margin-bottom:var(--spacing-sm);color:var(--color-text)}.project-meta{font-size:.9rem;color:#888;text-transform:uppercase;letter-spacing:1px;margin-bottom:var(--spacing-md)}.project-info p{font-size:1rem;color:#ccc;margin-bottom:var(--spacing-md);line-height:1.6}.project-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md)}.project-gallery img{width:100%;height:auto;border-radius:4px;transition:transform .3s ease}.project-gallery img:hover{transform:scale(1.02)}.small-btn{padding:8px 20px;font-size:.8rem;background-color:var(--color-accent);border:none}.small-btn:hover{background-color:#ff1f1f;color:#fff}@media (min-width: 768px){.modal-body{flex-direction:row}.project-info{flex:1;border-bottom:none;border-right:1px solid #333;padding-bottom:0;padding-right:var(--spacing-lg);max-width:350px}.project-gallery{flex:2;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}.close{position:absolute;top:10px;right:20px;color:#fff;font-size:30px;font-weight:700;cursor:pointer;line-height:1;z-index:10}.close:hover,.close:focus{color:var(--color-accent);text-decoration:none;cursor:pointer}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal.active{display:flex!important;animation:fadeIn .4s ease-out;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{position:relative;width:90%;max-width:1100px;max-height:90vh;background:#0f0f0ff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 25px 50px -12px #00000080;border:1px solid rgba(255,255,255,.1);overflow-y:auto;border-radius:16px;padding:0;display:flex;flex-direction:column;animation:scaleUp .4s cubic-bezier(.16,1,.3,1)}.modal-body{display:flex;flex-direction:column;width:100%}.project-info{padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md);background:linear-gradient(180deg,#ffffff08,#fff0);border-bottom:1px solid rgba(255,255,255,.05);text-align:center}.project-info h2{font-size:2rem;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-text);line-height:1.2;text-transform:uppercase;letter-spacing:1px}.project-meta{font-size:.85rem;color:var(--color-accent);text-transform:uppercase;letter-spacing:2px;font-weight:600;margin-bottom:var(--spacing-lg);display:block}.project-info p{font-size:1.1rem;color:#ccc;margin-bottom:var(--spacing-lg);line-height:1.8;max-width:600px;white-space:pre-line}.project-info p a{color:var(--color-accent);text-decoration:underline;transition:color .3s ease}.project-info p a:hover{color:#fff}.project-actions{margin-top:auto;padding-bottom:var(--spacing-sm)}.project-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-md);padding:var(--spacing-lg);background:#0003}.project-gallery img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:8px;transition:all .4s cubic-bezier(.25,.46,.45,.94);box-shadow:0 4px 6px -1px #0000001a;opacity:.9}.project-gallery img:hover{transform:scale(1.03) translateY(-4px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;opacity:1;z-index:2}.small-btn{padding:12px 28px;font-size:.85rem;background:#e50914cc;border:1px solid rgba(255,255,255,.1);border-radius:20px;font-weight:600;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 4px 15px #e509144d;transition:all .4s cubic-bezier(.175,.885,.32,1.275);color:#fff}.small-btn:hover{background-color:#f40612;transform:translateY(-4px) scale(1.05);box-shadow:0 10px 25px #e5091480;border-color:#ffffff4d}.close{position:absolute;top:20px;right:20px;width:44px;height:44px;border-radius:50%;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .4s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 4px 10px #0003;padding:0}.close:hover{background:#ffffff26;transform:rotate(90deg);border-color:#ffffff4d;color:#fff;box-shadow:0 8px 20px #0000004d}.project-gallery{padding:var(--spacing-sm) 5px}@keyframes scaleUp{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@media (min-width: 900px){.modal-content{flex-direction:row;overflow:hidden;height:85vh;max-height:900px}.modal-body{flex-direction:row;height:100%;width:100%;overflow:hidden;min-height:0;gap:0}.project-info{flex:0 0 40%;min-width:320px;max-width:450px;border-right:1px solid rgba(255,255,255,.1);border-bottom:none;overflow-y:hidden;display:flex;flex-direction:column;justify-content:center;padding:var(--spacing-lg)}.project-gallery{flex:1;overflow-y:auto;padding:var(--spacing-sm) var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-md);height:100%;min-height:0}}.about{padding:var(--spacing-xl) var(--spacing-md) 0;text-align:center;max-width:800px}.about h2{font-size:2rem;margin-bottom:var(--spacing-lg);text-transform:uppercase;letter-spacing:1px}.about p{margin-bottom:var(--spacing-md);font-size:1.1rem}.about-image{width:150px;height:150px;border-radius:50%;margin:0 auto var(--spacing-md);overflow:hidden;position:relative;box-shadow:0 0 20px #ffffff1a}.about-image img{width:100%;height:100%;object-fit:cover}.profile-placeholder{width:100%;height:100%;background:linear-gradient(45deg,#222,#333);display:flex;align-items:center;justify-content:center}.profile-placeholder:after{content:"Photo";color:#555;font-size:.8rem;text-transform:uppercase}.skills{display:flex;justify-content:center;gap:var(--spacing-sm);margin-top:var(--spacing-lg);flex-wrap:wrap}.skills span{padding:8px 16px;background:#222;border:1px solid #333;border-radius:20px;font-size:.9rem;letter-spacing:1px;text-transform:uppercase;color:#ccc}.contact{padding:var(--spacing-xl) var(--spacing-md);text-align:center;padding-bottom:var(--spacing-md)}.contact h2{font-size:2rem;margin-bottom:var(--spacing-lg);text-transform:uppercase;letter-spacing:1px}.contact p{margin-bottom:var(--spacing-lg);font-size:1.2rem}.contact .btn{font-size:1rem;padding:12px 30px}.social-links{margin-top:var(--spacing-lg);display:flex;justify-content:center;gap:var(--spacing-md);flex-wrap:wrap;max-width:800px;margin-left:auto;margin-right:auto}.social-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:140px;height:140px;background:#ffffff08;border-radius:24px;text-transform:uppercase;letter-spacing:1px;font-size:.85rem;font-weight:600;transition:all .4s cubic-bezier(.175,.885,.32,1.275);color:#fff;border:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 30px #0000001a}.social-btn svg{width:36px;height:36px;fill:currentColor;transition:transform .4s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.social-btn:hover{transform:translateY(-8px) scale(1.02);border-color:#fff6;background:#ffffff1a}.social-btn:hover svg{transform:scale(1.15) rotate(5deg)}.social-btn.email:hover{box-shadow:0 10px 40px -10px #ea433580;background:linear-gradient(135deg,#ea433533,#ffffff1a);border-color:#ea4335}.social-btn.instagram:hover{box-shadow:0 10px 40px -10px #dc274380;background:linear-gradient(45deg,#f0943333,#e6683c33,#dc274333,#cc236633,#bc188833);border-color:#e1306c}.social-btn.vimeo:hover{box-shadow:0 10px 40px -10px #1ab7ea80;background:linear-gradient(135deg,#1ab7ea33,#ffffff1a);border-color:#1ab7ea}.social-btn.linkedin:hover{box-shadow:0 10px 40px -10px #0077b580;background:linear-gradient(135deg,#0077b533,#ffffff1a);border-color:#0077b5}footer{border-top:1px solid rgba(255,255,255,.1);margin-top:var(--spacing-lg);padding-top:var(--spacing-sm);opacity:.6;font-size:.8rem;padding-bottom:var(--spacing-md)}.grid-item[data-project-id=media-watch] img{transform:scale(1.5)}.grid-item[data-project-id=media-watch]:hover img{transform:scale(1.6)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0a0a0a}::-webkit-scrollbar-thumb{background:#333;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}