header { position: fixed; top: 0; left: 0; right: 0; z-index: 200; background: rgba(243,239,229,.92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); transition: .3s; }
header.scrolled { box-shadow: 0 8px 30px -18px rgba(25,27,24,.4); }
.hdr { display: flex; align-items: center; justify-content: space-between; padding: .85rem 0; transition: .3s; }
header.scrolled .hdr { padding: .55rem 0; }
.logo { display: flex; align-items: center; gap: .9rem; font-weight: 700; }
.logo-mark { width: 48px; height: 48px; flex-shrink: 0; transition: transform .4s cubic-bezier(.3,1.2,.4,1); display: block; }
.logo:hover .logo-mark { transform: rotate(-4deg) scale(1.04); }
.logo-text-wrap { display: flex; flex-direction: column; line-height: 1.05; gap: 2px; }
.logo-name { font-family: var(--disp); font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; color: var(--ink); }
.logo-sub { font-family: var(--mono); font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: var(--mut); font-weight: 400; }
nav.main { display: flex; gap: 1.9rem; }
nav.main a { font-size: .92rem; font-weight: 500; position: relative; padding: .3rem 0; }
nav.main a::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--accent); transition: .3s; }
nav.main a:hover::after { width: 100%; }
.hdr-cta { display: flex; align-items: center; gap: .9rem; }
.hdr-tel { font-family: var(--mono); font-size: .85rem; color: var(--ink); }
.burger { display: none; background: none; border: 1px solid var(--ink); width: 44px; height: 44px; flex-direction: column; gap: 5px; align-items: center; justify-content: center; }
.burger span { width: 20px; height: 2px; background: var(--ink); transition: .3s; }
.mnav { position: fixed; inset: 0; background: var(--paper); z-index: 190; display: flex; flex-direction: column; justify-content: center; padding: 2rem 8%; gap: 1.1rem; transform: translateX(100%); transition: .4s cubic-bezier(.7,0,.2,1); }
body.nav-open .mnav { transform: none; }
body.nav-open { overflow: hidden; }
.mnav-head { display: flex; align-items: center; gap: 1rem; margin-bottom: 2.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.mnav a { font-family: var(--disp); font-size: 2rem; border-bottom: 1px solid var(--line); padding-bottom: .6rem; }
.mnav a:hover { color: var(--accent); padding-left: .6rem; transition: .25s; }