:root{
    --white:#ffffff; --ink:#0b0b0b; --ink-dim:#55524c; --ink-faint:#9a958b;
    --gold:#b8902f; --line:rgba(11,11,11,0.12);
    --font:'Outfit','Inter',system-ui,sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html,body{height:100%;}
  body{ background:var(--white); color:var(--ink); font-family:var(--font); font-weight:300; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  a{ color:inherit; text-decoration:none; }
  button{ font-family:inherit; }
  :focus-visible{ outline:1.5px solid var(--gold); outline-offset:3px; }

  /* ---------- top bar ---------- */
  .topbar{ position:fixed; top:0; left:0; right:0; z-index:100; display:flex; justify-content:space-between; align-items:center; padding:28px 44px; }
  .brand{ display:flex; align-items:center; gap:14px; }
  .crest{ width:38px; height:38px; border-radius:50%; border:1px solid var(--ink); display:flex; align-items:center; justify-content:center; font-weight:500; font-size:12px; letter-spacing:.04em; }
  .wordmark{ font-weight:500; font-size:12px; letter-spacing:.26em; text-transform:uppercase; }
  .hamburger{ width:44px; height:44px; border:1px solid var(--line); border-radius:50%; background:transparent; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; transition:border-color .3s; }
  .hamburger:hover{ border-color:var(--ink); }
  .hamburger span{ width:16px; height:1px; background:var(--ink); transition:all .3s ease; display:block; }
  .hamburger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
  .hamburger.open span:nth-child(2){ opacity:0; }
  .hamburger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

  .menu-overlay{ position:fixed; inset:0; background:rgba(11,11,11,0.28); z-index:150; opacity:0; pointer-events:none; transition:opacity .35s; }
  .menu-overlay.open{ opacity:1; pointer-events:auto; }
  .menu-panel{ position:fixed; top:0; right:0; height:100%; width:min(380px,88vw); background:var(--white); border-left:1px solid var(--line); z-index:200; transform:translateX(100%); transition:transform .45s cubic-bezier(.2,.7,.2,1); padding:120px 48px 40px; display:flex; flex-direction:column; }
  .menu-panel.open{ transform:translateX(0); }
  .menu-panel a.item{ font-weight:200; font-size:34px; letter-spacing:-.01em; padding:12px 0; border-bottom:1px solid var(--line); transition:color .25s, padding-left .25s; }
  .menu-panel a.item:hover{ color:var(--gold); padding-left:8px; }
  .menu-meta{ margin-top:auto; font-size:13px; color:var(--ink-dim); line-height:1.9; }
  .menu-close{ position:absolute; top:28px; right:44px; width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:none; color:var(--ink); cursor:pointer; font-size:14px; }

  /* ---------- hero ---------- */
  .hero{ position:relative; min-height:100vh; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; overflow:hidden; }
  .hero-photo{ position:relative; align-self:end; display:flex; justify-content:flex-start; padding-left:max(0px, calc((100vw - 1400px)/2)); }
  .hero-photo img{ display:block; height:min(100vh, 1000px); width:auto; max-width:100%; object-fit:contain; object-position:left bottom; mix-blend-mode:multiply; }
  .hero-text{ align-self:center; padding:104px 4vw 56px 2vw; max-width:760px; }

  .eyebrow{ display:flex; align-items:center; gap:14px; font-weight:500; font-size:12px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold); }
  .eyebrow::before{ content:''; width:34px; height:1px; background:var(--gold); }
  h1{ margin-top:22px; font-weight:200; font-size:clamp(48px,6.4vw,100px); line-height:.95; letter-spacing:-.035em; }
  h1 b{ font-weight:800; color:var(--gold); letter-spacing:-.04em; }
  .lead{ margin-top:26px; max-width:40ch; font-size:18px; line-height:1.65; color:var(--ink-dim); font-weight:300; }

  .cta{ margin-top:32px; display:inline-flex; align-items:center; gap:16px; padding:19px 34px; background:var(--ink); color:var(--white); font-weight:500; font-size:12px; letter-spacing:.22em; text-transform:uppercase; transition:background .35s, transform .35s; }
  .cta:hover{ background:var(--gold); }
  .cta .arrow{ transition:transform .3s; display:inline-block; }
  .cta:hover .arrow{ transform:translateX(5px); }

  .contact-row{ margin-top:40px; padding-top:22px; border-top:1px solid var(--line); display:flex; gap:32px; flex-wrap:wrap; }
  .contact-row div{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); font-weight:500; }
  .contact-row a{ display:block; margin-top:6px; font-size:14.5px; letter-spacing:0; text-transform:none; color:var(--ink); font-weight:300; transition:color .25s; }
  .contact-row a:hover{ color:var(--gold); }

  @media (max-width:900px){
    .topbar{ padding:20px 22px; }
    .hero{ grid-template-columns:1fr; }
    .hero-photo{ order:-1; padding:84px 0 0; justify-content:center; height:66vh; }
    .hero-photo img{ height:100%; object-position:center bottom; }
    .hero-text{ padding:30px 24px 70px; max-width:none; }
    .eyebrow{ letter-spacing:.2em; font-size:11px; }
    .eyebrow::before{ width:22px; }
    .menu-close{ right:22px; }
    .menu-panel{ padding:110px 28px 32px; }
  }
