:root{--color-bg: #0a0a0a;--color-text: #f2f2f2;--color-text-secondary: #aaaaaa;--color-accent: #ffffff;--color-hover: #1a1a1a;--font-primary: "Suisse", "Swiss 721", "Helvetica Neue", "Arial", sans-serif;--transition-speed: .3s;--transition-smooth: cubic-bezier(.4, 0, .2, 1);--header-height: 86px}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:500;letter-spacing:-.02em}a{color:inherit;text-decoration:none;transition:opacity var(--transition-speed) var(--transition-smooth)}a:hover{opacity:.7}.container{max-width:100%;margin:0 auto;padding:0}.container.header-container{padding:0 40px}@media (max-width: 768px){.container.header-container{padding:0 20px}}.header{position:fixed;top:0;left:0;right:0;z-index:1000;background-color:#0a0a0a9e;backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.08)}.header .container{display:flex;justify-content:space-between;align-items:center;padding-top:18px;padding-bottom:18px}.logo{font-size:56px;font-weight:700;letter-spacing:-.02em;text-transform:lowercase;line-height:1;position:relative;display:inline-flex;align-items:flex-end}.logo:after{content:"project";margin-left:1px;margin-bottom:7px;font-size:.16em;font-weight:600;letter-spacing:.05em;opacity:.9;text-transform:lowercase}.nav{display:flex;gap:22px;min-width:0;justify-content:flex-end}.nav-link{font-family:var(--font-primary);font-size:26px;font-weight:600;letter-spacing:.01em;text-transform:lowercase;position:relative;transition:opacity .25s ease}.nav-link:after{content:"";position:absolute;bottom:-6px;left:0;width:0;height:1px;background-color:var(--color-accent);transition:width .3s cubic-bezier(.4,0,.2,1)}.nav-link:hover{opacity:.65}.nav-link:hover:after{width:100%}@media (max-width: 768px){.logo{font-size:42px}.logo:after{margin-left:1px;margin-bottom:5px;font-size:.15em}.nav{gap:14px}.nav-link{font-size:20px}}.main{position:relative;padding-top:var(--header-height);padding-bottom:70px;min-height:100vh}.hero{position:relative;height:clamp(200px,34vh,340px);overflow:hidden;margin-bottom:0}.hero-media{width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:saturate(.88) contrast(.95) brightness(.56)}.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,#0a0a0a2e,#0a0a0a9e)}.hero-content{position:absolute;inset:auto 0 12px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px}.hero-kicker{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-secondary)}.hero-arrow{font-size:38px;line-height:1;color:var(--color-text);opacity:.85}.projects-mosaic{position:relative;width:100%;margin:0;display:grid;grid-template-columns:1fr;gap:0}.project-card{position:relative;aspect-ratio:auto;height:calc(100vh - var(--header-height));overflow:hidden;border:1px solid rgba(255,255,255,.02);cursor:pointer;content-visibility:auto;contain-intrinsic-size:1000px 560px}.project-card-large{grid-column:auto}.project-card-video{aspect-ratio:auto;height:calc(100vh - var(--header-height));min-height:420px;background:#000}.project-card.video-fallback .project-preview-video{opacity:0}.project-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--transition-smooth),opacity .28s var(--transition-smooth)}.project-card:hover .project-image{transform:scale(1.025)}.project-preview-video{width:100%;height:100%;object-fit:cover;object-position:center;display:block;transition:transform .6s var(--transition-smooth),opacity .28s var(--transition-smooth);background:var(--color-hover);transform:translateZ(0);-webkit-transform:translateZ(0)}.project-preview-video::-webkit-media-controls,.project-preview-video::-webkit-media-controls-enclosure,.project-preview-video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}@supports (-webkit-touch-callout: none){.project-card,.project-card-large,.project-card-video{content-visibility:visible;contain-intrinsic-size:auto}}.project-card:hover .project-preview-video{transform:scale(1.025)}.project-card .project-image,.project-card .project-preview-video{pointer-events:none}.project-overlay{position:absolute;inset:0;background:linear-gradient(to top,#000000b8,#0000 62%);display:flex;align-items:flex-end;padding:28px 24px}.project-title{font-size:clamp(20px,2.5vw,34px);font-weight:600;letter-spacing:-.02em;text-transform:lowercase}.footer{padding:22px 20px 28px;text-align:center}.footer p,.footer a{font-size:11px;color:var(--color-text-secondary);letter-spacing:.08em;text-transform:uppercase}.footer a:hover{color:var(--color-text);opacity:1}@media (max-width: 768px){:root{--header-height: 126px}.container.header-container{padding:0 16px}.header .container{display:grid;grid-template-columns:1fr;justify-items:start;row-gap:8px;padding-top:12px;padding-bottom:12px}.header{backdrop-filter:none;background-color:#0a0a0af0}.logo{font-size:clamp(34px,9vw,42px);line-height:1}.nav{width:100%;min-width:0;justify-content:flex-end;flex-wrap:wrap;gap:12px}.nav-link{font-size:16px;letter-spacing:.03em}.hero{height:clamp(160px,26vh,240px)}.projects-mosaic{width:100%;margin:0;grid-template-columns:1fr}.project-card,.project-card-large{aspect-ratio:auto}.project-card-video{aspect-ratio:auto;height:calc(100vh - var(--header-height));min-height:260px}.project-overlay{padding:18px 16px}.project-title{font-size:clamp(17px,7vw,26px)}}@media (max-width: 420px){:root{--header-height: 114px}.header .container{row-gap:6px;padding-top:10px;padding-bottom:10px}.logo{font-size:32px}.logo:after{margin-left:2px;margin-bottom:5px;font-size:.19em}.nav{gap:8px}.nav-link{font-size:14px}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}
