html { scroll-behavior: smooth; }
* { box-sizing: border-box; }
body.avenir {
  margin: 0;
  background: #000;
  color: #e5e5e5;
  font-family: "Avenir Next", "Avenir Next LT Pro", Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
img { max-width: 100%; display: block; }
.container { max-width: 1120px; margin: 0 auto; padding: 0 20px; }

/* Header */
.header { position: sticky; top:0; z-index:50; background: rgba(0,0,0,.6); backdrop-filter: blur(6px); border-bottom: 1px solid #2a2a2a; transition: box-shadow .25s, background .25s; }
.header.scrolled { background: rgba(0,0,0,.9); box-shadow: 0 2px 12px rgba(0,0,0,.5); }
.header-inner { height:64px; display:flex; align-items:center; justify-content:space-between; }
.brand-logo { height: 24px; }
.brand-logo.small { height: 20px; }
.nav { display:flex; align-items:center; gap: 24px; }
.nav .btn { margin-left: 8px; }
.burger { display:none; font-size:22px; background:none; border:none; color:#e5e5e5; }

/* Mobile menu */
.mobile-menu { display:none; flex-direction:column; gap:12px; padding:12px 20px; border-top:1px solid #2a2a2a; }
@media (max-width: 860px){
  .nav { display:none; }
  .burger { display:block; }
  .mobile-menu.show { display:flex; }
}

/* Links */
.navlink { position:relative; display:inline-block; color:#cfcfcf; text-decoration:none; font-size:14px; }
.navlink:hover { color:#fff; }
.navlink::after { content:""; position:absolute; left:0; bottom:-6px; height:1px; width:100%; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; background:rgba(255,255,255,.7); }
.navlink:hover::after { transform:scaleX(1); }

/* Buttons */
.btn { display:inline-block; padding:10px 16px; border-radius:10px; text-decoration:none; font-weight:600; }
.btn.primary { background:#fff; color:#000; }
.btn.primary:hover { background:#e5e5e5; }
.btn.outline { border:1px solid #4a4a4a; color:#cfcfcf; }
.btn.outline:hover { color:#fff; border-color:#7a7a7a; }
.btn.block { display:block; text-align:center; }

/* Sections */
.section { padding: 72px 0; border-top: 1px solid #2a2a2a; }
.section:first-of-type { border-top:none; }
.section.alt { background:#0a0a0a; }
.grid { display:grid; gap:24px; }
.grid.two { grid-template-columns: 1.2fr 1fr; }
.grid.three { grid-template-columns: repeat(3, 1fr); }
.grid.six { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 1024px){ .grid.two { grid-template-columns:1fr; } .grid.three { grid-template-columns:1fr 1fr; } .grid.six { grid-template-columns:1fr 1fr 1fr; } }
@media (max-width: 640px){ .grid.three { grid-template-columns:1fr; } .grid.six { grid-template-columns:1fr 1fr; } }

.hero { position:relative; }
.hero::before { content:""; position:absolute; inset:0; pointer-events:none; mask-image: radial-gradient(ellipse at center, black 35%, transparent 70%); -webkit-mask-image: radial-gradient(ellipse at center, black 35%, transparent 70%); }
.hero-media { aspect-ratio: 4/3; border:1px solid #2a2a2a; background:#0f0f0f; border-radius:16px; overflow:hidden; }
h1 { font-size: 40px; line-height:1.1; margin:0; }
h2 { font-size: 30px; margin:0; }
h3 { font-size: 18px; margin:0 0 6px; }
.lead { color:#b5b5b5; max-width: 720px; }
.muted { color:#8a8a8a; font-size: 14px; }
.cta-row { display:flex; gap:12px; margin-top: 16px; }
.badges { display:flex; gap:18px; margin-top: 16px; color:#8a8a8a; font-size: 14px; }

.card { background:#0a0a0a; border:1px solid #2a2a2a; border-radius:16px; padding:20px; }
.work-media { aspect-ratio: 4/3; background:#111; overflow:hidden; }
.work img { width:100%; height:100%; object-fit:cover; }
.work-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0 0; }
.logo-card { height:80px; border:1px solid #2a2a2a; border-radius:12px; display:grid; place-items:center; background:#0a0a0a; }
.logo-card img { max-height:40px; width:auto; opacity:.9; }

/* Contact */
.contact-list { list-style:none; padding:0; margin:14px 0 0; display:grid; gap:6px; color:#cfcfcf; }
.card label { display:block; font-size:14px; color:#cfcfcf; margin-bottom:10px; }
.card input, .card textarea {
  width:100%; background:#111; color:#fff; border:1px solid #2a2a2a; border-radius:10px; padding:10px;
}
.card input::placeholder, .card textarea::placeholder { color:#777; }

/* Footer */
.footer { border-top:1px solid #2a2a2a; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px 0; }
.footer .left { display:flex; align-items:center; gap:12px; }
.footer .right { display:flex; align-items:center; gap:16px; }

/* Preloader */
.preloader { position:fixed; inset:0; background:#000; display:grid; place-items:center; z-index:100; }
.preloader-box { text-align:center; padding:32px; }
.preloader-logo { height:48px; margin:0 auto; }
.preloader-bar { margin-top:16px; height:1px; width:160px; background:#1f1f1f; overflow:hidden; }
.preloader-bar span { display:block; height:1px; width:100%; background:#e5e5e5; transform-origin:left; animation:bar .9s ease forwards; }
@keyframes bar { from { transform:scaleX(0) } to { transform:scaleX(1) } }

/* Reveal animations */
.reveal { opacity:0; transform: translateY(12px); }
.reveal.show { opacity:1; transform: none; transition: opacity .5s ease, transform .5s ease; }